Dynamically switch styles

[Echos]

I decided I was going to learn CSS, JavaScript, and PHP. Currently I am in the process of starting a web page. I would like to use JavaScript to choose a style from a drop down box and dynamically switch to a different style sheet depending on the choice. Right now, I can only set it up with one style sheet. The part I'm really having a hard time is with my images as well. Any suggestions are greatly appreciated.

Thanks.

[ddadmin]

Hmmm closest thing I can think of: http://www.dynamicdrive.com/dynamici...etswitcher.htm

[Wedgy]

what is going on with your images? perhaps I can help with that.

[Echos]

So I've got it so that I can dynamically change the css with a drop down box, change all the images, and set a cookie so that the css travels from page to page. But my images revert to the default when traveling from page to page and I'm not sure how to keep them staying with the css. For instance:

default is "Pink.css" with a button "pink.jpg"
when I switch to "Blue.css" the first time, it will change the button to "blue.jpg" but when I navigate to a different page on the site, it will stay "Blue.css" but the button will be "pink.jpg". How do I change that?

[Twey]

You need to store that in the cookie too, and construct the images dynamically. Be careful to preserve compatibility with non-JS browsers.

[Echos]

Do you have some good suggestions on where to look to dynamically change the image src?

[Twey]

You can manipulate img.src as with any other string, where "img" is an image object.

[Echos]

I was given the suggestion of setting the size of a link and setting the background image to the image for my button. It works a lot more smoothly and it changes when I change my css.

so I have
a{background-image: url('image.jpg');} <!--valid-->
you can't set the image source through a CSS
img{src: url('image.jpg');} <!--not valid-->

This way I still only need one cookie for the CSS and not multiple cookies for the images.

The images that aren't links I put as divs.

http://www.rustipher.com/~loni/

[Echos]

I can't seem to find where I can set the "selected" option for my css dropdown box. Whenever I go to a different page or style, it reverts back to Cutesy. Do you have a suggestion or does it need to be through a cookie or script?

[Twey]

Oh, I see. I'm sorry, but you can't change image srcs with CSS. I was using Javascript. I suppose you could use divs with background-images; is that what you're referring to above?