Menu
I'm struggling to use Bootstrap tooltips with image links. The problem is that when the img tag is inside the a tag, the tooltip doesn't display at the correct spot and seems to flicker. When inspecting the HTML, the actual a tag is beneath the image altogether. Here's a fiddle: http://jsfiddle.net/paniwani/DUPyR/248/
975
By using the Tooltip.js plugin of Bootstrap framework, you may create tooltips for different elements like buttons, links, text boxes etc. quite easily. I will show you how to create simple and customized tooltips with online examples in this tutorial. You may click on any image or link below the image for seeing the live demos.
To create a tooltip, you need to add the data-bs-toggle="tooltip" attribute to an element. Tolltip text that would display on hover can be specified using the title attribute. Here is the standard markup for adding a tolltip to a hyperlink.
To create a tooltip, add the data-toggle="tooltip" attribute to an element. Use the title attribute to specify the text that should be displayed inside the tooltip: <a href="#" data-toggle="tooltip" title="Hooray!"> Hover over me </a> Note: Tooltips must be initialized with jQuery: select the specified element and call the tooltip () method.
The Tooltip plugin is small pop-up box that appears when the user moves the mouse pointer over an element:
This works:
a { display: inline-block; }
http://jsfiddle.net/DUPyR/249/
155
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
