How can i persist the themes that is set by a theme switcher implemented in jquery? -
my default link tag path pointing css
my css paths containing different themes:
cssa/jquery-ui-1.10.4.custom.min.css cssb/jquery-ui-1.10.4.custom.min.css cssc/jquery-ui-1.10.4.custom.min.css cssd/jquery-ui-1.10.4.custom.min.css csse/jquery-ui-1.10.4.custom.min.css cssf/jquery-ui-1.10.4.custom.min.css dropdown button implementation of theme switcher boot.html switch theme
<ul class="dropdown-menu"> <li> <a data-theme="cssa/jquery-ui-1.10.4.custom.min.css">dark</a> </li> <li> <a data-theme="csse/jquery-ui-1.10.4.custom.min.css">apple</a> </li> <li> <a data-theme="cssb/jquery-ui-1.10.4.custom.min.css">blue</a> </li> <li> <a data-theme="cssc/jquery-ui-1.10.4.custom.min.css">pearl</a> </li> <li> <a data-theme="cssd/jquery-ui-1.10.4.custom.min.css">box</a> </li> </ul> </li> jquery code:
$(window).load(function () { var link = $('link.me'); $('ul.dropdown-menu li').click(function (e) { e.preventdefault(); var theme = $(this).find('a').data('theme'); alert(theme) link.attr('href', theme) }); }); themes switches perfectly. if refresh page link tag points default css path css/jquery-ui-1.10.4.custom.min.css. how can create theme persist after refreshing page?
you can create utilize of cookies store values of preferences. , check values in stored cookies 1 time again retrieve preferred value. refer this link understanding basics of cookies.
basic illustration of cookies:
<!doctype html> <html> <head> <script> function setcookie(cname,cvalue,exdays) { var d = new date(); d.settime(d.gettime() + (exdays*24*60*60*1000)); var expires = "expires=" + d.togmtstring(); document.cookie = cname+"="+cvalue+"; "+expires; } function getcookie(cname) { var name = cname + "="; var ca = document.cookie.split(';'); for(var i=0; i<ca.length; i++) { var c = ca[i].trim(); if (c.indexof(name) == 0) homecoming c.substring(name.length, c.length); } homecoming ""; } function checkcookie() { var user=getcookie("username"); if (user != "") { alert("welcome 1 time again " + user); } else { user = prompt("please come in name:",""); if (user != "" && user != null) { setcookie("username", user, 30); } } } </script> </head> <body onload="checkcookie()"> </body> </html> jquery
No comments:
Post a Comment