SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    May 2008
    Posts
    231
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    info panel or sort of tooltip with info

    How do I create an info panel, similar to the attached one with CSS? So when a user hovers on a product, the info panel shows up and the user can click any information in the info panel.

    An example is used on this site;http://www.shopstyle.co.uk/browse/bracelets

    Thanks
    P

    infopanel.jpg

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,203
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    This is normally done with JavaScript, but it can be done to some extent with CSS (though the boxes won't stay open with CSS, but will only show on hover). Here are some examples:

    http://www.pmob.co.uk/search-this/tooltip-basic.htm
    http://www.pmob.co.uk/pob/disjointed1.htm
    http://www.search-this.com/2008/02/13/disjointed-css/

    Here are a few JS ones I know of:

    http://pop.seaofclouds.com/
    http://demo.tutorialzine.com/2010/07...colortips.html
    http://raena.net/trythis/citetooltips.html
    http://www.walterzorn.de/tooltip/tooltip.htm

  3. #3
    SitePoint Addict
    Join Date
    May 2008
    Posts
    231
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, I think this http://pop.seaofclouds.com/ will work, I just have to style the box and also use on mouseover to trigger
    the box


Tags for this Thread

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
  •