Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Sep 2009
    Posts
    57
    Thanks
    6
    Thanked 0 Times in 0 Posts

    onmouseover not firing in firefox

    Hi. I've been working on a project for some time now, and just recently I installed Firefox. Now, part of the site (which works perfectly in IE6/7) doesn't work in Firefox. Here is part of the code:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Meniu de navigare</title>
    </head>
    <body bgcolor="#000437">
    <table width="119" style="position:relative; top:35%">
    <a href="pag_start.html" target="continut"><tr><td class="nav_bar" height="24" background="p1.png" valign="center" onmouseover="background='p2.png'" onmouseout="background='p1.png'" onmousedown="background='p3.png'" onmouseup="background='p2.png'">Home</td></tr></a>
    
    blah blah blah
    
    </table>
    </body>
    </html>
    (I didn't copy all of the code because it's basically the same all the way down)
    The main problem is with the link (Firefox apparently doesn't recognize table rows as links). The second problem is with the onmouseover/onmouseout etc handlers (absolutely nothing happens).
    Any ideas how to solve this? Thanks. Bye.

    PS: just in case you need to know, the code is for a nav bar.

  • #2
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by speedy_rudolf View Post
    The main problem is with the link (Firefox apparently doesn't recognize table rows as links). The second problem is with the onmouseover/onmouseout etc handlers (absolutely nothing happens).
    Table rows aren't links.

    I would guess that those handlers are executing and the statement background='p2.png' should create a global variable called statementbackground and assign it the string 'p2.png', which is what should happen in the real world.

    Try: onmouseover="this.style.backgroundImage='url(p2.png)'"
    Last edited by Logic Ali; 01-03-2011 at 09:09 PM.

  • #3
    New Coder
    Join Date
    Sep 2009
    Posts
    57
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Logic Ali View Post
    Table rows aren't links.

    I would guess that those handlers are executing and the statementbackground='p2.png' should create a global variable called statementbackground and assign it the string 'p2.png', which is what should happen in the real world.

    Try: onmouseover="this.style.backgroundImage='url(p2.png)'"
    Yeah...Now the onmouseover works....What about the "rows as links" part? Any idea how to make that work? More specifically, I what to use as link the entire cell (background+text, not just text).

    Thanks a lot for the onmouse over solution.

  • #4
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by speedy_rudolf View Post
    Yeah...Now the onmouseover works....What about the "rows as links" part? Any idea how to make that work? More specifically, I what to use as link the entire cell (background+text, not just text).

    Thanks a lot for the onmouse over solution.
    Your markup isn't valid. The answer is to have the link within the <td> and styled display:block:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Meniu de navigare</title>
    </head>
    <body bgcolor="#ffffff">
    <table width="119" style="position:relative; top:35%">
    <tr><td class="nav_bar" height="24" onmouseover="this.style.backgroundImage='url(bluesquare.gif)'" onmouseout="background='p1.png'" onmousedown="background='p3.png'" onmouseup="background='p2.png'"><a href="pag_start.html" target="continut" style='display:block'>Home</a></td></tr>
    </table>
    </body>
    </html>

  • #5
    New Coder
    Join Date
    Sep 2009
    Posts
    57
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Logic Ali View Post
    Your markup isn't valid. The answer is to have the link within the <td> and styled display:block:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Meniu de navigare</title>
    </head>
    <body bgcolor="#ffffff">
    <table width="119" style="position:relative; top:35%">
    <tr><td class="nav_bar" height="24" onmouseover="this.style.backgroundImage='url(bluesquare.gif)'" onmouseout="background='p1.png'" onmousedown="background='p3.png'" onmouseup="background='p2.png'"><a href="pag_start.html" target="continut" style='display:block'>Home</a></td></tr>
    </table>
    </body>
    </html>
    Yep....That works perfectly...Thanks a lot


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •