Display just bellow the link on mouse over.

Question

I have some links and a div in my web page.On mouse over the link I need to display the div just bellow the link.How to do it so that on mouse hovering any link the div will display just bellow that link only(I mean like a tooltip)?

Answer 1

Steps to do

1. Add the tooltip div with absolute position and hide it.
2. Bind hover event to andchor tags.
3. Get element position using .offset() method
4. Set the top and left position of the tooltip div with the values from .offset().top and .offset().left