james13009 Posted January 7, 2008 Share Posted January 7, 2008 im currently designing a website with using styleSwap.js javascript, it swaps over the stylesheets the users preferance. (so the user get a choice of different colour backgrounds e.t.c) demo here:( http://www.nationalspares.co.uk/index.php ) And select a colour (top right) then click channels button My problem is though: I select a swapsheets the cookie remembers the stylesheet i that i want fine. But it always loads the default stylesheet first from the CSS <link> tags and when it gets to the <body onload="loads-User-stylesheet"> for example it finally loads the one the user selected. So the user sees the old stylesheet and then the one they wanted (ie the page loads twice) Is there anyway i can stop this. maybe move the onload="loadstylesheet" above the CSS <link> tags? for example but how and where too???? anyway too see my problem click here: http://www.nationalspares.co.uk/index.php And select a colour from the top left then click channels button Many thanks James Quote Link to comment Share on other sites More sharing options...
phpQuestioner Posted January 7, 2008 Share Posted January 7, 2008 you could create a default stylesheet without BODY background color style and then have your javascript to check to see if a cookie exist for each specific stylesheet and if the cookie does not exist; display another default stylesheet with a BODY background color style in it (alternatively, instead of creating an additional stylesheet; you could just write the BODY background color style in as embedded CSS in the web page). do something like: <link rel="stylesheet" type="text/css" href="default.css" /> <script language="javascript"> function getLatestStyles() { var mycookie = getCookie('style_v1'); var mycookie2 = getCookie('style_v2'); var mycookie3 = getCookie('style_v3'); if (mycookie != null) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style1.css\" />"); } else if (mycookie2 != null) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style2.css\" />"); } else if (mycookie3 != null) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style3.css\" />"); } else { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style1.css\" />"); } } window.onload=function() { setTimeout("getLatestStyles()", 100); } </script> alternatively; you could do this: <link rel="stylesheet" type="text/css" href="default.css" /> <script language="javascript"> function getLatestStyles() { var mycookie = getCookie('style_v1'); var mycookie2 = getCookie('style_v2'); var mycookie3 = getCookie('style_v3'); if (mycookie != null) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style1.css\" />"); } else if (mycookie2 != null) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style2.css\" />"); } else if (mycookie3 != null) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"style3.css\" />"); } else { document.getElementsByTagName('body')[0].style.background='url("http://www.nationalspares.co.uk/Images/Layouts/back.gif")'; } } window.onload=function() { setTimeout("getLatestStyles()", 100); } </script> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.