SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Addict zeeb44's Avatar
    Join Date
    Apr 2011
    Location
    Greenville, SC
    Posts
    202
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Tooltip coding help

    This tool tip from Dynamic Drive, Can it be modified to not disappear if you are hovering over the tool tip? Right now it disappears after a set time that is set in the java script. But I want it to disappear only if you are not hovered over the icon or tool tip itself. Can this be done?

    http://www.dynamicdrive.com/dynamici...oontooltip.htm
    Last edited by zeeb44; Jul 18, 2011 at 16:01. Reason: Forgot Link

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,696
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    In the displayballoontip() function you can add to dropmenuobj an onmouseover event to the clearhidemenu function, and an onmouseout event to the delayhidemenu function.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Addict zeeb44's Avatar
    Join Date
    Apr 2011
    Location
    Greenville, SC
    Posts
    202
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by paul_wilkins View Post
    In the displayballoontip() function you can add to dropmenuobj an onmouseover event to the clearhidemenu function, and an onmouseout event to the delayhidemenu function.


    I'm very new to JavaScript so that was a little over my head. Tried following it but messed it up. Can you insert it where it needs to go and show me please?

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,696
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by zeeb4 View Post
    I'm very new to JavaScript so that was a little over my head. Tried following it but messed it up. Can you insert it where it needs to go and show me please?
    Let's break down what I said.

    In the displayballoontip() function ...
    That's the function called displayballoontip:

    Code javascript:
    function displayballoontip(obj, e){ //main ballooon tooltip function
        ...
    }

    ... you can add to dropmenuobj ...
    The dropmenuobj variable is declared at this place:

    Code javascript:
    dropmenuobj=document.getElementById(obj.getAttribute("rel"))

    ... an onmouseover event to the clearhidemenu function ...
    That would be this new line of code, placed just after the one above:

    Code javascript:
    dropmenuobj.onmouseover = clearhidemenu;

    ... and an onmouseout event to the delayhidemenu function.
    That whould be this new line of code, which follows the above new line:

    Code javascript:
    dropmenuobj.onmouseout = delayhidemenu;

    That seems to be very clear to me. Do you require me to
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,696
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by zeeb4 View Post
    I'm very new to JavaScript so that was a little over my head. Tried following it but messed it up. Can you insert it where it needs to go and show me please?
    Let's break down what I said.

    In the displayballoontip() function ...
    That's the function called displayballoontip:

    Code javascript:
    function displayballoontip(obj, e){ //main ballooon tooltip function
        ...
    }

    ... you can add to dropmenuobj ...
    The dropmenuobj variable is declared at this place in the above function:

    Code javascript:
    dropmenuobj=document.getElementById(obj.getAttribute("rel"))

    ... an onmouseover event to the clearhidemenu function ...
    That would be this new line of code, placed just below the one above:

    Code javascript:
    dropmenuobj.onmouseover = clearhidemenu;

    ... and an onmouseout event to the delayhidemenu function.
    That would be this new line of code, which follows below the above new line:

    Code javascript:
    dropmenuobj.onmouseout = delayhidemenu;

    Is that clear enough for you?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  6. #6
    SitePoint Addict zeeb44's Avatar
    Join Date
    Apr 2011
    Location
    Greenville, SC
    Posts
    202
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes thanks. That makes sense and worked perfectly. Thanks for the help.


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
  •