Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery tooltip, but on click instead of hover

Tags:

jquery

We were using 'title' attributes to display something on mouseover. We want it now to display on a click. How can I get a floating box that looks like a title/tooltip, but can be shown and hidden on demand instead of being tied to a hover?

like image 709
Dustin Getz Avatar asked Aug 21 '09 17:08

Dustin Getz


1 Answers

If you feel like handcoding it, this should do the job:

The html:

<div id="tooltip" style="display:none;">bla bla</div>

<div id="yourLink">Click here to show the tooltip!</div>

And the JS:

$('#yourLink').click(function(){
  $('#tooltip').toggle();
});

You just need to style correctly the tooltip div

There are also nice tooltip plugins out there. iftrue mentioned one, there is also this one

like image 157
marcgg Avatar answered Sep 28 '22 07:09

marcgg