javascript - Dynamically change stylesheet onclick anywhere on site -
i wondering if there's way keep changing stylesheet (so series of 5 or so) of whole page every time user clicks anywhere @ all.
maybe using $(document).click
function?
give main <link>
tag id , create array of href url's want.
<link data-style_index="0" id="main-style" href="main.css" rel=.... >
jquery:
var styles =['url1.css','url2.css','url3.css'...]; $(document).click(function(){ var $link =$('#main-style'), // index stored on element data , increment nextindex = $link.data('style_index') + 1; //revert first if @ last 1 if( nextindex === styles.length){ nextindex = 0; } // change href , store new index value in tag data $link.attr('href', styles[nextindex]).data('style_index', nextindex); });
using element store current index styles array in html5 data-
attribute
Comments
Post a Comment