SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Addict delpino's Avatar
    Join Date
    Nov 2001
    Location
    London
    Posts
    335
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    clickable table cell not working in Opera / Mozilla

    Hello,

    Anybody knows how to make this work in Opera and Mozilla? Its a clickable table cell. Works only in IE.

    HTML Code:
     <tr>
          <td onMouseOver="this.style.backgroundColor='#e9e9e9';"
          onMouseOut="this.style.backgroundColor='white';"
          onClick="java_script_:location.href('show_links.php')">
         <span class="fakelink">more ...</span>
          </td>
          </tr>
    I don't want it to open the url in a new browser window. Strange why does vBulletin change "javascript" to "java_script_"?
    Last edited by delpino; Nov 8, 2003 at 16:31.
    http://www.antosch-and-lin.com - Language Learning

  2. #2
    SitePoint Addict delpino's Avatar
    Join Date
    Nov 2001
    Location
    London
    Posts
    335
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    onClick="window.open('show_links.php','_self')" seems to be the solution.. you could also replace _self with the frame's name.
    http://www.antosch-and-lin.com - Language Learning

  3. #3
    SitePoint Guru bronze trophy blufive's Avatar
    Join Date
    Mar 2002
    Location
    Manchester, UK
    Posts
    853
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My memory's going, but I think that needs to be:
    Code:
    onClick="java_script_:document.location.href='show_links.php'"

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by blufive
    My memory's going, but I think that needs to be:
    Code:
    onClick="java_script_:document.location.href='show_links.php'"
    Nope. Location.href belongs to the window object, not document. However, the best approach is one that requires no scripting at all:

    CSS
    Code:
    td a.somelink {
      display: block;
      background: white;
      color: black;
    }
    td a.somelink:hover {
      background: #e9e9e9;
    }
    HTML:
    HTML Code:
    <td><a class="somelink" href="show_links.php">My link</a></td>
    This works in IE5+ (Windows and Mac), Mozilla (all platforms), Safari, Opera, etc. etc.

  5. #5
    SitePoint Evangelist ucahg's Avatar
    Join Date
    Apr 2001
    Location
    Sarnia, Ontario, Canada
    Posts
    434
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Agree with Vinnie.

    Yours wasn't working because of the java_script_: prefix you added. That prefix tells the browser that a link is actually a javascript command. However, onclick, onmouseover, onmouseout, etc. are all events with javascript code that is executed when that particular event is fired. So you would write your javascript for onclick in the same way you write it for onmouseover (no java_script_: prefix).
    Love it? Hate it? Helpful? Useless?
    Use the rate button to let me know what you think of my post!

  6. #6
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    td a.somelink {
      display: block;
      width: 100%;
      height: 100%;
      background: white;
      color: black;
    }
    The javascript&#58; url - while superfluous - has nothing to do with why it wasn't working. Location.href is a string property - not a function - so you assign it a value, instead of calling it. Not surprised that it works in IE, everything seems to (so much for standards).

    Document.location was once read-only, holding the actual url of the displayed page, sometimes different than the originally loaded one (as with a redirect). It's now Document.URL, and Document.location has (apparently) been mapped to Window.location, as it is now read/write in all browsers, and functions the same.
    ::: certified wild guess :::

  7. #7
    SitePoint Evangelist ucahg's Avatar
    Join Date
    Apr 2001
    Location
    Sarnia, Ontario, Canada
    Posts
    434
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh, of course. I should've looked more closely.
    Love it? Hate it? Helpful? Useless?
    Use the rate button to let me know what you think of my post!

  8. #8
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by adios
    Code:
     td a.somelink {
       display: block;
       width: 100%;
       height: 100%;
       background: white;
       color: black;
     }
    Width isn't needed, since display: block; will take up the remaining width of the table cell. Height is only needed if you're being picky or have defined the height of the table cell.

  9. #9
    SitePoint Addict delpino's Avatar
    Join Date
    Nov 2001
    Location
    London
    Posts
    335
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Doesn't really look good if you use cellpadding.
    http://www.antosch-and-lin.com - Language Learning


Bookmarks

Posting Permissions

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