PDA

View Full Version : javascript and css

quiet1storm123
09-01-2002, 06:01 AM
I created a javascript that allows you to change the body background color by clicking on a button.

I have a linked stylesheet that also sets the background color.

I am using IE6.

When I comment out the stylesheet the javascript works perfectly, but when I add the stylesheet the background color is always the color selected by the stylesheet.

My understanding is that parameters designated in the code have first priority, then parameters from an included stylesheet and lastly parameters from a linked stylesheet. Since the javascript is in the code, I would think it would override the stylesheet. Do I just not understand??????:confused:
MCookie
09-01-2002, 06:55 AM
Does the JavScript set the background-color in the body tag? Like <body bgcolor="#..">? That would be overridden by the stylesheet.
But if you want to play with different styles, take a look at ALA's stylechanger at http://www.alistapart.com/stories/alternate/ ...definitely much more fun.
joh6nn
09-01-2002, 06:55 AM
can we see the page this is on?
duniyadnd
09-01-2002, 12:12 PM
My understanding is that parameters designated in the code have first priority, then parameters from an included stylesheet and lastly parameters from a linked stylesheet. Since the javascript is in the code, I would think it would override the stylesheet. Do I just not understand??????

Okay, as I see it, you could mean, and not realise it, first priority to execute. That means that the body tag is executed first and is then replaced by included stylesheet, and then linked stylesheet. I'm not sure if this is the correct order of priorities, but it would make sense if this is the problem you're getting.

Duniyadnd
MCookie
09-01-2002, 12:26 PM
Inline style (in the page), embedded style (in the head) and linked stylesheets.
The inline style is most important.
But if you set a background-color in a linked stylesheet and put "bgcolor="#.." in a tag... well that's not CSS, so it's still the linked stylesheet that has most priority...
adios
09-02-2002, 12:54 AM
The cascade (the 'C' in CSS) has nothing to do with what happens when you change .style properties programmatically (with JS). Scripted style alterations will always be displayed immediately - there's no weighing of multiple style declarations to consider, you're fiddling with DOM properties. If it's not working, presumably there's an error in your code.

Maybe I'm misunderstanding your Q...:confused:
Quiet Storm
09-02-2002, 11:22 PM
Show us the URL of the site you're doing this to, or please post your code... :)
SYP}{ER
09-04-2002, 12:20 AM
Try this:

body.style.backgroundColor = '#ff0000';

That won't be affected by the stylesheet (well it'll just overwrite it if it's there)
realisis
09-05-2002, 09:34 AM
SYP}{ER is correct.

I think your problem arises because your JS might be setting background color with the document.bgColor statement? If so then yes the STYLE would have priority I think.