Javascript - changing CSS classes - won't work in IE

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
MarK (CZ)
Forum Contributor
Posts: 239
Joined: Tue Apr 13, 2004 12:51 am
Location: Prague (CZ) / Vienna (A)
Contact:

Javascript - changing CSS classes - won't work in IE

Post by MarK (CZ) »

Stupid IE once again :evil:
Or maybe it's me :P


The problem is like this - I'm using JavaScript to change the classes of DIV. In Firefox everything works fine but IE seems to "see" only the first of the generated classes.

Code: Select all

<style type='text/css'>
div#mapcz_top.range1 {background-color: red; background-position: 175px 107px;}
div#mapcz_top.range17 {background-color: red; background-position: 176px 108px;}
div#mapcz_top.range4 {background-color: red; background-position: 172px 102px;}
[...]
  </style>

Code: Select all

<a href='#' onmouseover='document.getElementById("mapcz_top").className = "range1"'
             onmouseout='document.getElementById("mapcz_top").className = "nospot"'>AVIM Praha</a><br />
<a href='#' onmouseover='document.getElementById("mapcz_top").className = "range17"'
             onmouseout='document.getElementById("mapcz_top").className = "nospot"'>Kapslovna</a><br />
<a href='#' onmouseover='document.getElementById("mapcz_top").className = "range4"'
             onmouseout='document.getElementById("mapcz_top").className = "nospot"'>Magnum Praha</a><br />
[...]
Strange thing in IE is that only changing of the first class works as it should.
Any idea where is the problem solution?
:?:
User avatar
MarK (CZ)
Forum Contributor
Posts: 239
Joined: Tue Apr 13, 2004 12:51 am
Location: Prague (CZ) / Vienna (A)
Contact:

Post by MarK (CZ) »

Noone has any idea? :(
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Post by Benjamin »

Hmm,

try this..

Code: Select all

<a href="" class="range1" onmouseover="this.className='range1';" onmouseout="this.className='nospot';">blah</a>
User avatar
MarK (CZ)
Forum Contributor
Posts: 239
Joined: Tue Apr 13, 2004 12:51 am
Location: Prague (CZ) / Vienna (A)
Contact:

Post by MarK (CZ) »

I'm not changing the class of the link itself but of another div, so I have to use it's id :?
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Post by Benjamin »

Are you getting any Javascript errors in IE?
User avatar
MarK (CZ)
Forum Contributor
Posts: 239
Joined: Tue Apr 13, 2004 12:51 am
Location: Prague (CZ) / Vienna (A)
Contact:

Post by MarK (CZ) »

No :(
That would at least point me somewhere...
User avatar
MarK (CZ)
Forum Contributor
Posts: 239
Joined: Tue Apr 13, 2004 12:51 am
Location: Prague (CZ) / Vienna (A)
Contact:

Post by MarK (CZ) »

I tried cutting some of the generated classes - IE still works only with the first one of them.

Is there any error in my CSS code?

Code: Select all

<style type='text/css'>
div#mapcz_top.range11 {background-position: 172px 232px;}
div#mapcz_top.range12 {background-position: 197px 103px;}
div#mapcz_top.range13 {background-position: 279px 174px;}
div#mapcz_top.range14 {background-position: 192px 113px;}
div#mapcz_top.range15 {background-position: 236px 118px;}
div#mapcz_top.range16 {background-position: 278px 110px;}
div#mapcz_top.range17 {background-position: 176px 108px;}
[...]
</style>
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Post by Benjamin »

No CSS looks fine. IE is quirky with JS though. I would just search around google and look at other examples and maybe try to find a different method.
User avatar
MarK (CZ)
Forum Contributor
Posts: 239
Joined: Tue Apr 13, 2004 12:51 am
Location: Prague (CZ) / Vienna (A)
Contact:

Post by MarK (CZ) »

astions wrote:IE is quirky with JS though.
Is there any area where it isn't? :?

Anyway, I'm setting the BG position directly by the JS and seems to work...
Thanks for your time ;)
Post Reply