how to make cluetips jquery show right side of <table>

Question

I have a table that load some datas from an ajax query..

I tried to make a cluetip (local, with arrows) on it..

this is my cluetip options:

$('.load-local').cluetip({
        sticky: true,
        arrows: true,
        showTitle: false,
        mouseOutClose: true,
        delayedClose: 400,
        local: true,
        hideLocal: true,
        width: 170
    });

I put it on a certain <td> (under 'Details' section)..

So that when user hover to its <td> a cluetip will showing on the right side like I want..

I attached a preview of it:

Then, I decided to modified it to be more effective for user..

So if user hover to a <tr> , the cluetip will showing..

But, when I put cluetip class and rel attribute on this <tr> , the cluetip is showing on the left side..

I attached a preview of it:

I want: when user hover to the <tr> the cluetip will show on right side (like I did on the <td> )..

How can I make it?

I have already tried with jquery to trigger the <td> when mouseover the <tr> , but still failed..

Do you have any idea about it?

Thank You Very Much..

Answer 1

Have you done..

$('.load-local td').cluetip({
        sticky: true,
        arrows: true,
        showTitle: false,
        mouseOutClose: true,
        delayedClose: 400,
        local: true,
        hideLocal: true,
        width: 170
    });

Try and select the child td elements of tr.