I love the hover effects of StackOverflow.
I want to use similar feature
You can use .animate
like this demo i made in jsfiddel http://jsfiddle.net/qJ8NB/1/
Just add some nice css on the div and you could make it look like SO.
Here's an UPDATE http://jsfiddle.net/qJ8NB/11/
The new jQuery UI tooltip is quite good: http://jqueryui.com/tooltip/#custom-style
The animation is controllable, the tooltip is styleable, you can pretty much mimic the StackOverflow like tooltips.
Note that i linked you the "custom style" example. It shows you how to make custom styles for the tooltip.
Also that by default the tooltip shows the title attribute of an element. There is an example: http://jqueryui.com/tooltip/#custom-content where custom content is set in different ways to show you a few options.
I'm not sure what feature is missing.
EDIT: the custom content demo is bugged on the example site, check it in full page view: http://view.jqueryui.com/menubar/demos/tooltip/custom-content.html
EDIT2: New Solution
Looking at Anton's answer I thought that this could be done correctly by adding the tooltip's div inside the original div, and introducing hoverintent. Also a little sanitization of the code was in order. Check: http://jsbin.com/anegip/2/edit
http://jsbin.com/anegip/3/edit
With a little design, it's what you want.
Please have a look this plugin. Using this you can achieve the same effect as same as stackoverflow. click here
just make it urself by using (link) . Add html and customize css according to your need.
I know this is old, but I was looking for the same thing, and... In case anyone wants something that actually looks like StackOverflow's tag tooltips... (and why wouldn't you? they're totally awesome)
Demo: http://jsbin.com/korehubi/10
Code: http://jsbin.com/korehubi/10/edit
Painstakingly reproduced by going through StackOverflow's code.
Usage:
<div class="firstElement">The thing to hover over.</div>
<div class="coolTip" id="firstElement">This is the tooltip content.</div>
coolTips()
on page load.Note the contents of the tooltip div in the example above is just to demonstrate usage. You need to use HTML tags for the tooltip content as shown in the jsbin link, in order to have StackOverflow-esque formatted tooltips. You'll also need all the CSS shown there.
Enjoy :)
Update: Now checks if the tooltip would leak out of the window border, and animates from the right or bottom instead in those cases.