WordPress.org

Ready to get started?Download WordPress

Forums

WordPress Tooltip
Tooltip Position (5 posts)

  1. StellarBytes
    Member
    Posted 2 years ago #

    Hey

    I have enabled the 'WordPress ToolTip' plugin and have used the following code to generate a tooltip over an image link in the footer of my site:

    [code]a href="#" class="wp-tooltip" title="Visit our online shop for special offers"><img src="images/shop-logo.gif" alt="Shop Online" /></a[/code]

    Note: Removed the first < and final > from code above because the code seems to get stripped out in this forum.

    This displays the tooltip when the image is hovered over, but the tooltip 'arrow' (at the bottom of the tooltip) is in line with the bottom of the image. Using Firebug, I've tried to pull this apart and see where the CSS is being applied, to make the tooltip 'pop up' above the image, not covering the image. From here I gather I have to apply 'tip_top' class - Firebug shows this class is enabled on the 'tiptip_holder' div.

    Is this a case of not being able to see the wood for the trees?

    Thanks

    http://wordpress.org/extend/plugins/wp-tooltip/

  2. StellarBytes
    Member
    Posted 2 years ago #

    DOH!

    Open tipTip.css

    Find:

    #tiptip_holder {
    	display: none;
    	position: absolute;
    	top: 0;
    	left: 0;
    	z-index: 99999;
    }

    Edit line:
    top: 0;
    To:
    top: 10px;
    Increase the value (eg. 10px > 100px) to increase the height value between your text, image, etc and the tooltip itself.

    Top Tip: (No puns intended) Don't work on the same issue for hours, go take out your frustrations by trying to replace your car wiper blades before realising the garage gave you the wrong ones!! Come back, then you'll find the problem yourself in 30 seconds.

  3. jdev
    Member
    Posted 2 years ago #

    How about the width? How can I change that?

  4. dipaksaraf
    Member
    Posted 2 years ago #

    HEllo

    I am trying to integrate the tooltip on imagemap and when the user will hover over a particular area the content will be displayed.

    It is working perfectly in FF, though i have tweaked the tipTip.css in order to position the tip, but it seems to be not working on IE. Please suggest how to resolve this issue.

    Thanks
    Dipak

  5. TF28
    Member
    Posted 2 years ago #

    Great Plugin! Thanks!
    But what can I do to show the Tooltip above the text not below?

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic