Jump to content

Style Sheets


theone

Recommended Posts

Hi All,I am trying to change the atribute of a class in a style sheet, i would like to do this to the actual style sheet its self, not the page, so when the class is called, the changed attribute is called, not the old one. i need to do it in IE and NetScape, so could someone show me some code or point me in the right direction, and, while we are at it, is it the same method for an id style?thanks allAndrew

Link to comment
Share on other sites

what is the code in the stylesheet and what class and attribute are you trying to change?
i have a td cell that i attach a mouseover/leave listener to, and when it goes over/out it changes the class of the td cell, and i need to change the font size of the over/out class atribute,i.e..over{ font-size:24px; (etc) }.out { font-size:24px; (etc) }i need to access the code it the above example, which is part of a link-style-sheet and change the font size to another font, (and is it the same for id's as well?.thanksAndrew :)
Link to comment
Share on other sites

Edit the css file using a text editor like notepad and simply change the attributes to the selected size.

.over{ font-size:18px; (etc) }.out { font-size:12px; (etc) }

and then save the file, reload the page into your Browser and it should be good.And id's are the same thing to change.

Link to comment
Share on other sites

Edit the css file using a text editor like notepad and simply change the attributes to the selected size.
.over{ font-size:18px; (etc) }.out { font-size:12px; (etc) }

and then save the file, reload the page into your Browser and it should be good.And id's are the same thing to change.

i need to change the font size after the page and style-sheet and javascript-sheet has loaded, changing it before is not a problem, i need a javascript method/call to do this when it is called "onLoad"thanksAndrewp.s. i have looked and not found anything, so not sure if it can be done!
Link to comment
Share on other sites

You might look into using document.styleSheets to get at the style sheet data, but I've no experience with it and don't know if you can set the properties or if they are read-only.Here's a link to get you started:http://www.pxl8.com/styleSheet_object.html============================If it were me, I would probably set up multiple css classes - one for one font-size, another for a bigger font-size - and then change the className of the element:

document.getElementById("myElement").className = "Bigger";

Or, like in the link that pulpfiction provided, I would access the style property of the element and increse the font-size with the DOM:

document.getElementById("myElement").style.fontSize = "32px";

Or, if I needed to do this for all paragraph elements, for example, I'd do something like this:

var ps = document.getElementsByTagName("p");for(var i = 0; i < ps.length; i++){	ps[i].style.fontSize = "32px";	// OR:	// ps[i].className = "Bigger";}

EDIT: Here's another link for accessing the stylesheet through the DOM:http://www.javascriptkit.com/domref/stylesheet.shtml

Link to comment
Share on other sites

not realy, lets say, the style sheet has.MyClass { fontsize:24px; }and after the page loads, this,(some javascript method).MyClass.Style.fontsize="30px";thanks
You are looking for javascript to modify the CSS Class. Something like, after modifying the css class, when you use it again, the font size must be 30px and not 24px. hope this is what you are looking for...This is not the exact solution, but might help http://www.quirksmode.org/dom/w3c_css.html#style
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...