An Entrepreneur, Coach, IT Consultant, Strategic Adviser, and a Traveler craving to explore and contribute to forming a better society.

Thursday, August 20, 2009

Change Your Stylesheet on "onclick" Event

No comments :
Change Stylesheet Refreshing the Page - Javascript

1. Produce your link tag as follows

<link id="basestyle" href="default.css" media="all" type="text/css" rel="stylesheet"/>
2. Create the following function in your javascript (js) file
function changeStyle( themeName ){
document.getElementById( "basestyle" ).href= themeName+ ".css";

3. Create buttons that will call the "changeStyle" function on "onclick" event
<input type="button" value="default" onclick="changeStyle( this.value )" />
<input type="button" value="blue" onclick="changeStyle( this.value )" />
<input type="button" value="red" onclick="changeStyle( this.value )" />
<input type="button" value="green" onclick="changeStyle( this.value )" />

4. Thats it done.

Please download the sample script in the following URL:

Featured Blog Topics:

No comments :