PDA

View Full Version : Changing CSS styles with JS

HD_X
09-03-2002, 07:22 PM
I am new to JavaScript programming and CSS. Basically I was wondering if JS can be used to changed the properties defined in a CSS. I can change things if it has an ID. But I havent figured out how to change attributes in a class.
Basically I want to do something like this


<html>
<head>
<style>
.mystyle {color:blue}
</style>
</head>
<body>
<p class="mystyle">Test1</p>
<p class="mystyle">Test2</p>


<script>

//do something to change mystyles's color to red

</script>

</body>
</html>



Thanks,
HD_X
HD_X
09-03-2002, 08:35 PM
<html>
<head>
<style>
.mystyle {color:blue}
</style>
</head>
<body>
<p class="mystyle">Test1</p>
<p class="mystyle">Test2</p>


<script>

//do something to change mystyles's color to red

document.styleSheets[0].rules[0].style.color='red';
//ns = document.styleSheets[0].cssRules[0].style.color='red';


</script>

</body>
</html>



the above non commented lines is for ie 4+
Mr J
09-04-2002, 08:23 PM
try this



<style>
.one{color:red;font-weight:bold}
.two{color:blue;font-weight:bold;font-size:40;background-color:gold;width:250}
</style>

<P onmouseover="this.className='two'" onmouseout="this.className='one'" >Hello HD_X</P>