please dont rip this site
Javascript Style Sheets

Note : Javascript Style Sheets are only supported by the Navigator component of Netscape Communicator.

As well as fully supporting the Cascading Style Sheets specification (see Style Sheets overview), Netscape introduced Javascript Style Sheets. Even though all CSS style sheet declarations can be re-written in JSS, the results would only be visible in Netscape v4.0 and above and the style sheet declarations can not be manipulated through scripting without re-loading the document.

The most basic method of declaring a style using Javascript Style Sheets is to reference the particular element through Netscape's tags array (a property of the Document Object). For example:

<STYLE TYPE="text/javascript">
tags.P.color = "#FF0000"
</STYLE>

Note the different TYPE attribute for the <STYLE> element. The above declaration sets all <P> elements to use a red colour in the document. For specifying multiple declarations for the same element, the width keyword can be used. For example:

<STYLE TYPE="text/javascript">
with (tags.P) {
color = "#FF0000";
fontSize = "20pt";
margin = "0.5in";
}
</STYLE>

Note the subtle difference between the JSS syntax (e.g. fontSize) and that of standard CSS (e.g. font-size). A more complete listing of the changes is given below.

To specify classes of style sheet declaration (i.e. as you would with .className {declaration} in CSS), the classes property must be used. For example:

<STYLE TYPE="text/javascript">
classes.yellow.all.color="#FF0000"
</STYLE>

The style could then be used as :

<P CLASS="yellow"> some yellow text

To specify classes for just one element, change the all keyword for the element name (i.e classes.red.P.color="#FF0000" / <P CLASS="red">.

Javascript style sheets also have a similar mechanism for using the ids property, to set styles for elements that use their ID property to reference a style sheet. This can allow multiple styles to be attached to a single element. For example, setting:

<STYLE TYPE="text/javascript">
classes.BigText.all.fontSize = "20pt"
ids.BlueText.color = "#0000FF"
</STYLE>

and then using:

<P CLASS="BigText" ID="BlueText">Some big blue text

would give the paragraph text a blue colouring, as well as it being big text.

For contextual selection of style declarations, simply use:

<STYLE TYPE="text/javascript">
contextual(tags.H1, tags.EM).color = "green";
</STYLE>

this is the same as using H1 EM {color:green} as one would when using standard Style Sheets.

CSS vs. JSS property names
As with the Internet Explorer specific Style Object, Netscape renamed some of the style sheet properties for use with Javascript Style Sheets. Basically, where the style sheet name has a hyphen, the Javascript style sheet name uses an unhyphenated, mixed case name. I.e. border-color would be borderColor, text-align is textAlign. That aside, the property values that can be attributed to the various Javascript style sheets properties are the same as those that can be set for the various standard CSS properties. Take a look through the Properties and Values topics for more information on style sheet attribute values.


file: /Techref/language/html/ib/Style_Sheets/jss.htm, 5KB, , updated: 2004/3/1 15:47, local time: 2024/12/14 01:52,
TOP NEW HELP FIND: 
18.97.14.91:LOG IN

 ©2024 These pages are served without commercial sponsorship. (No popup ads, etc...).Bandwidth abuse increases hosting cost forcing sponsorship or shutdown. This server aggressively defends against automated copying for any reason including offline viewing, duplication, etc... Please respect this requirement and DO NOT RIP THIS SITE. Questions?
Please DO link to this page! Digg it! / MAKE!

<A HREF="http://techref.massmind.org/techref/language/html/ib/Style_Sheets/jss.htm"> Javascript Style sheets</A>

After you find an appropriate page, you are invited to your to this massmind site! (posts will be visible only to you before review) Just type a nice message (short messages are blocked as spam) in the box and press the Post button. (HTML welcomed, but not the <A tag: Instead, use the link box to link to another page. A tutorial is available Members can login to post directly, become page editors, and be credited for their posts.


Link? Put it here: 
if you want a response, please enter your email address: 
Attn spammers: All posts are reviewed before being made visible to anyone other than the poster.
Did you find what you needed?

 

Welcome to massmind.org!

 

Welcome to techref.massmind.org!

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  .