How to make qtip tooltip with cursor

Question

I am using the jt library qtip tooltip. I want the qtip cursor to move with the cursor when I hover over a hover row in a table. I know how to make my own tooltip with a cursor movement, but I'm struggling with qtip. Please explain the code you are responding to. Thanks

My html:

<table> <div id="hoverdiv"></div> <tr class="hover" hovertext="Some text"> <td>Total Credits</td> <td><%= @total_credit %></td> </tr> </table> 

I can create a normal tooltip (without qtip js lib) to follow my cursor using the following jquery code

 $(document).ready(function() { $('.hover').mousemove(function(e) { var hovertext = $(this).attr('hovertext'); $('#hoverdiv').text(hovertext).show(); $('#hoverdiv').css('top', e.clientY+10).css('left', e.clientX+10); }).mouseout(function() { $('#hoverdiv').hide(); }); }); 

And the code to display the qtip static hint:

 $(document).ready(function() { $('.hover').each(function() { $(this).qtip({ content: $(this).attr('hovertext') }); }); }); 

This is what I have tried so far:

 $(document).ready(function() { $('.hover').mousemove(function(e) { $(this).qtip({ content: $(this).attr('hovertext') }); $('').css('top', e.clientY+10).css('left', e.clientX+10); }); }); 

Answer 1

According to qTip docs :

When position.target is set to mouse, this parameter determines whether the tooltip follows the mouse when you hover over show.target.

Example:

 $('.selector').qtip({ content: { text: 'I follow the mouse whilst I\'m visible. Weeeeee!' }, position: { target: 'mouse', adjust: { mouse: true // Can be omitted (eg default behaviour) } } }); 

And the jsFiddle example .