PDA

View Full Version : Style sheet switcher not working as it should


X-Tream
05-28-2011, 03:34 PM
1) Script Title:
Style Sheet Switcher (v1.1)
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex9/stylesheetswitcher.htm
3) Describe problem:

This is pretty hard to explain, but the problem is this:

When you go to my site:
http://netti-tv.net ( Language is Finnish. )
you will see under the "keskustelu" navigation, a link saying "Valitse Teema". When you press it it pop ups with different colors. Now lets say you press the red one. It works as it should in all of the other pages except my forum ( by pressing "keskustelu" it will take you there ) First it starts loading with the correct color, but after it has loaded, the site the color changes back to orange...

Now when you choose a color from the forum, lets say blue, and press "Etusivu" ( index.html ) it works like it should. It changes the color etc. Now the problem is that it only works one way. You can only change the color from the forum, if you want it to work with all of your pages...

I hope you guys understand the problem... (:
Now for the codes what I have been using:

index.html:

<html><head>
.
.
.
<link rel="stylesheet" type="text/css" href="tyyli.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="punainen" href="punainen.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="sininen" href="sininen.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="vihrea" href="vihrea.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="pinkki" href="pinkki.css" />
<script src="styleswitch.js" type="text/javascript">

/***********************************************
* Style Sheet Switcher v1.1- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>
.
.
.
</head><body>
.
.
.
<div id="teema1"><a href="javascript:chooseStyle('none', 60)" checked="checked"></a></div>
<div id="teema2"><a href="javascript:chooseStyle('punainen', 60)"></a></div>
<div id="teema3"><a href="javascript:chooseStyle('sininen', 60)"></a></div>
<div id="teema4"><a href="javascript:chooseStyle('vihrea', 60)"></a></div>
<div id="teema5"><a href="javascript:chooseStyle('pinkki', 60)"></a></div>
.
.
.
</body></html>

Forum: (header)

<html><head>
.
.
.
<link rel="stylesheet" type="text/css" href="http://netti-tv.net/tyyli.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="punainen" href="http://netti-tv.net/punainen.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="sininen" href="http://netti-tv.net/sininen.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="vihrea" href="http://netti-tv.net/vihrea.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="pinkki" href="http://netti-tv.net/pinkki.css" />
<script src="http://netti-tv.net/styleswitch.js" type="text/javascript">

/***********************************************
* Style Sheet Switcher v1.1- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>
.
.
.
</head><body>
.
.
.
<div id="teema1"><a href="javascript:chooseStyle('none', 60)" checked="checked"></a></div>
<div id="teema2"><a href="javascript:chooseStyle('punainen', 60)"></a></div>
<div id="teema3"><a href="javascript:chooseStyle('sininen', 60)"></a></div>
<div id="teema4"><a href="javascript:chooseStyle('vihrea', 60)"></a></div>
<div id="teema5"><a href="javascript:chooseStyle('pinkki', 60)"></a></div>
.
.
.
</body></html>

( Thats only the important parts of the code...if you want to see the rest of the code just go to my site and check it (: )

So as you can see the only difference is that the code has "http://netti-tv.net/"...I just have no idea how to fix this problem...I hope someone can help me. It would mean a lot for me. (:
jscheuer1
05-28-2011, 05:58 PM
I just tried it out, and it's working fine here in Firefox and IE. But that actually might be the problem. The style switcher works by creating a domain specific cookie. If one specifies not www dot whatever as:


http://netti-tv.net/styleswitch.js

does, and the other doesn't specify at all, as:


styleswitch.js

does not, it's possible that the www is getting introduced there. The cookie will not see:


http://netti-tv.net/

and

http://www.netti-tv.net/

as the same domain.

But then it shouldn't work at all from forum to index, or from index to forum, not even for a moment. That could be just the time it takes for the page to start loading though. And once set in the forum it should work only for the forum and not elsewhere, once set elsewhere it should work only for the other pages, not on the forum. Unless something is resetting the path going from - say the forum back to the index page.

And, it's probably not that path. Though, and if it is, I've no idea how, it could be. That's only the path to the script. What should matter is the domain name in the path to the pages - what shows in the address bar.

When it's not working do you see www. in the address bar for one page and not in the other? If so, we have to figure out how and where www. is getting introduced, or taken away and either stop that, or make sure that in a given session it gets carried to all inter-site links.

I see on the forum that the menu links contain the absolute path, whereas on the index page they are the relative path. The only exception on both pages is that on both the menu link to the forum uses the network path (starts with / indicating the root of the domain). The only type that's a problem for the cookie is the absolute path. If they all could either relative or network, and these two types can be mixed on the domain, that might solve the problem.

But there could be other links to the various pages elsewhere on the site. These too should be of either the network or the relative variety.
X-Tream
05-30-2011, 04:43 PM
Hi jscheuer1 and thank you for answering my question! (:

I changed the forums links to relative path ( or at least I think so... ) but it's not working... Could you provide me with the correct codes, as I believe I'm doing something wrong?

And I would like to thank you again for helping me with my problem. (:
jscheuer1
05-30-2011, 05:33 PM
Yeah, that's not the problem in this case. It's good you changed that, because it could be a problem for some users.

Anyways, I see another issue. The forum page has two style switcher scripts. One isn't Dynamic Drive and that one is executing later (onload), possibly - probably overriding the Dynamic Drive one. The DD script executes as the page is loading, hence it appears to work at first.

I didn't even notice before because the forum page takes so long to load, I thought it was finished and switched back to the index or changed the color before it had a chance to mess up.

So my advice would be to get rid of this script:


<script type="text/javascript" src="./styles/prosilver_nettitv/template/styleswitcher.js"></script>

from the forum page.

That may or may not cause other problems. But if it doesn't do anything fatal, it might fix this other issue.

Make sure to clear the browser's cache, delete cookies, and refresh the page after making the change and before testing the results.
X-Tream
05-31-2011, 09:03 AM
Thank you so much jscheuer1 for helping me! (:

I deleted the script and it's now working perfectly. (: