image map with show/hide layer - Firefox problem |
image map with show/hide layer - Firefox problem |
unata |
Mar 26 2007, 08:54 PM
Post
#1
|
Group: Members Posts: 4 Joined: 26-March 07 Member No.: 2,341 |
Hi, there. I am new to the forum and hope this is an easy question!
I have an image map with absolute divs that show up on the hot spot rolloves. (Javascript show/hide layer function). This is not working in Firefox at all. http://www.clients.idea-bureau.com/fortis/..._bill/bill.html. I've never done tooltips thing on a image map and am hoping this is an easy solve, sort of "place your divs after the image map" kind of thing! Thank you! Natalia. This post has been edited by unata: Mar 26 2007, 09:23 PM |
Effovex |
Mar 26 2007, 09:50 PM
Post
#2
|
Serious Coder Group: Members Posts: 251 Joined: 6-January 07 From: Sherbrooke, Qc, Canada Member No.: 1,477 |
Use document.getElementByID instead of document.all. It's the standard (DOM) way to do this and should work in every standard-supporting browser. You'd lose IE4 support so if you really feel like it I guess you can use document.all in addition.
document.layers is what? Netscape 4? And document.all is IE4. That's 10 years old Javascript. You might want to find newer ressources (I like How to create but there are many others. Just google for DOM scripting) This post has been edited by Effovex: Mar 26 2007, 09:54 PM |
unata |
Mar 27 2007, 09:54 AM
Post
#3
|
Group: Members Posts: 4 Joined: 26-March 07 Member No.: 2,341 |
That did help, I got my long-lost rollovers in Firefox, thank you!
They are not popping up in the right place though. The parent table's position is relative to the bigger table position: relative; left: 5px; top: 5px; and the divs are absolute divs. #brightideas{ left: 285px; top: 478px; width: 164px; height: 69px; visibility: hidden; position: absolute; } Is there another trick I don't know? |
Effovex |
Mar 27 2007, 10:16 AM
Post
#4
|
Serious Coder Group: Members Posts: 251 Joined: 6-January 07 From: Sherbrooke, Qc, Canada Member No.: 1,477 |
Position the object in relation to the mouse as part of the getElementByID function. I think it would look like that:
CODE if (document.getElementById && !document.all) { maxwell_smart = document.getElementById(layer_ref); maxwell_smart.style.visibility = state; maxwell_smart.style.top = event.clientY; maxwell_smart.style.left = event.clientX; } I didn't test it because I hate testing in Firefox. |
unata |
Mar 27 2007, 11:16 AM
Post
#5
|
Group: Members Posts: 4 Joined: 26-March 07 Member No.: 2,341 |
I somehow think that it's CSS problem - will keep looking for hacks.
|
unata |
Mar 27 2007, 11:32 AM
Post
#6
|
Group: Members Posts: 4 Joined: 26-March 07 Member No.: 2,341 |
got it fixed - replaced the container table (that had position:relative) with container div, again position:relative.
|
Lo-Fi Version | Time is now: 19th March 2024 - 05:48 AM |