Home Page
RABiD BUNNY FEVER
K.T.K

  • July 05, 2022, 05:26:05 PM *
  • Welcome, Guest
Please login or register.

Login with username, password and session length
Advanced search  

News:

Official site launch very soon, hurrah!


Author Topic: An easier way to exchange style sheets in HTML  (Read 6023 times)

Dakusan

  • Programmer Person
  • Administrator
  • Hero Member
  • *****
  • Posts: 528
    • View Profile
    • Dakusan's Domain
An easier way to exchange style sheets in HTML
« on: September 28, 2009, 05:31:14 AM »


I have seen rather complex code out there for style sheet swapping in web browsers through JavaScript, and just found out a much simpler way works.

I could have sworn I tried to do real-time style sheet swapping a very long while back and none of my tests turned out satisfactorily, but a friend was just asking me about it, and I was redoing the tests, and it all worked out perfectly in an incredibly easy fashion in IE 6 & 7 and Firefox 2.5 & 3. All that needs to be done is swap the href of the link object pointing to the external style sheet file.

<link href="OLDSTYLESHEET.css" rel=stylesheet type="text/css" id=MyScriptSheet>
<input type=button onclick="document.getElementById('MyScriptSheet').href='NEWSTYLESHEET.css'">

Adding style sheets by dynamically inserting HTML via JavaScript seemed to work just fine too.

document.body.innerHTML+='<link href="NEWSTYLESHEET.css" rel=stylesheet type="text/css">';
Logged