style property IE vs Netscape

[Shawn Modersohn]

<script type="text/javascript">
var browser=navigator.appName
if (browswer="Microsoft Internet Explorer")
document.styleSheets[0].rules[4].style.left="50px"
</script>

IE does exactely what I hoped this script would do. Netscape says that
document.styleSheets[0].rules has no properties. Since this script is
targeted at IE anyway, should I be concerned? Also, is this script way
oversimplified? All the css rule does is shift an image slightly to
compensate for css overflow differences in the two browsers.

 

[Lasse Reichstein Nielsen]

<script type="text/javascript">
var browser=navigator.appName
if (browswer="Microsoft Internet Explorer")

Using "appName" to detect the browser is not reliable.
I am using Opera. If I set it to emulate IE, it would also have
an appName of "Microsoft Internet Explorer".

document.styleSheets[0].rules[4].style.left="50px"

IE does exactely what I hoped this script would do. Netscape says
that document.styleSheets[0].rules has no properties.

That's because it doesn't. Mozilla (and therefore Netscape 6+)
implements the W3C DOM 2 Style specification, so it would be
document.styleSheets[0].CSSrules

Since this script is targeted at IE anyway, should I be concerned?

It gives an error where there is no need for it.

Also, is this script way oversimplified? All the css rule does is
shift an image slightly to compensate for css overflow differences
in the two browsers.

Then it's not oversimplified, but overcomplicated.
Just use IE's conditional comments:
---
<!--[if lt IE 7]>
<style type='text/css'>
.someImeage { left : 50px; }
</style>
<![endif]-->

 

[Michael Winter]

On Sun, 15 Aug 2004 12:35:40 +0200, Lasse Reichstein Nielsen

[snip]

document.styleSheets[0].CSSrules

cssRules

[snip]

Mike

 

[Lasse Reichstein Nielsen]

On Sun, 15 Aug 2004 12:35:40 +0200, Lasse Reichstein Nielsen

document.styleSheets[0].CSSrules

cssRules

Doh! Thanks.
/L

 

[Randy Webb]

<script type="text/javascript">
var browser=navigator.appName
if (browswer="Microsoft Internet Explorer")
document.styleSheets[0].rules[4].style.left="50px"
</script>

IE does exactely what I hoped this script would do.

Actually, it doesn't do what you *think* it does though.

Netscape says that document.styleSheets[0].rules has no properties.

Thats because its taking the branch of the if that it shouldn't be,
because you are doing an incorrect comparison. == is comparison, = is
assignment. So your if statement is testing to see if it can set the
string browser equal to "Microsoft Internet Explorer", which any browser
should do and pass the test.

The correct test would be (notwithstanding the problems mentioned in
other posts about the appName):

if (browser == '...'){

 

[Alberto]

Rearrange the expression
document.styleSheets[0].rules[4].style.left="50px"
into:

if(document.styleSheets){
document.styleSheets[0][
(document.styleSheets[0].rules)?"rules":"cssRules"
][4].style.left="50px";
};


This grants a level of compatibility without browser sniffing.

PS if by chance you add a style sheet node before that style sheet [0], or a
css rule before rule [4], you won't arguably get anymore what you expect: if
you're going to use that indexing, be sure the structure of your style
sheets in your page never changes BEFORE index 4 of the rule, nor before
index 0 of the style sheet itself.

ciao
Alberto
http://www.unitedscripters.com/