SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Thread: Tooltip onClick

  1. #1
    SitePoint Member
    Join Date
    Oct 2005
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Tooltip onClick

    I've searched, and found many good css tooltip scripts, but can't find the one that I need: A css tooltip-type script that occurs onClick, with a hide button.

    I've got a list of more than 100 names in a roster, and want to be able to click on any of them, popping up the tooltip (with all their info) in the center of the page.

    I'm still new at all this. Can anyone point me in the right direction?

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,527
    Mentioned
    84 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by barryL View Post
    A css tooltip-type script that occurs onClick, with a hide button.
    It sounds like this dialog box may be suitable, that you can style to appear as you wish.
    http://jqueryui.com/dialog/

    Is that the sort of thing that you are looking for?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    Barefoot on the Moon! silver trophy
    Force Flow's Avatar
    Join Date
    Jul 2003
    Location
    Northeastern USA
    Posts
    4,524
    Mentioned
    52 Post(s)
    Tagged
    1 Thread(s)
    You can essentially whip up your own.

    Make a div with a unique ID in your HTML code, with everything you want to show in your tooltip. Then apply the display:none CSS.

    Then for your target, use onclick attribute to trigger your javascript to use the getElementById() function and apply the display:block CSS.

    For the close button, use another target span or div inside of the parent div of your tooltip with another onclick attribute to apply display:none to the parent div again.
    Visit The Blog | Follow On Twitter
    301tool 1.1.5 - URL redirector & shortener (PHP/MySQL)
    Can be hosted on and utilize your own domain

  4. #4
    SitePoint Member
    Join Date
    Oct 2005
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Both of you were a HUGE help. Not sure which way I'll go, but appreciate the two choices!

    This is the absolute best place on the internet to get the right answer the first time without any drama!

    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
  •