SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Feb 2006
    Posts
    257
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Alter mouse pointer on JS mouse over

    Hi,

    I use the following code to toggle the display of some data in a table...

    Code:
    <script> function toggle() { if( document.getElementById("hidethis").style.display=='none' ){ document.getElementById("hidethis").style.display = ''; }else{ document.getElementById("hidethis").style.display = 'none'; } }</script>
    
    <span onClick="toggle();"><u>edit</u></span>
    
    <table width="80%" border="0" align="center" cellpadding="5" cellspacing="0">
                <tr id="hidethis" style="display:none;">
                  <td>hello!</td>
                </tr>
              </table>
    Is there a way of getting the 'edit' text that can be clicked on to act like a link, so the mouse pointer changes and it picks up the default link styling from my style sheet? Even just having the correct mouse pointer would be fine, I can live without the style stuff if necessary.

    Cheers.

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why not use a link?
    Code HTML4Strict:
    <a href="#" onclick="toggle(); return false;">edit</a>

    If, for some odd reason, you can't use a link, you could style it with CSS,
    Code HTML4Strict:
    <span class="fake-link" onclick="toggle()">edit</span>
    Code CSS:
    a:link, .fake-link {
      ...style rules for links and fake links...
      cursor:pointer;
    }

    Finally, if you're intent on doing this with JavaScript:
    Code HTML4Strict:
    <span onclick="toggle()" onmouseover="this.style.cursor=pointer"><u>edit</u></span>
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Addict
    Join Date
    Feb 2006
    Posts
    257
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah, it was the return false; that I needed to stop it jumping around - thanks!


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
  •