Showing tooltip on top

Question

I am using qtip for showing tooltip and everything seems good but when I set the position of my tooltip to the top tooltip again is shown on the bottom:

here is my javascript code:

$(document).ready(function () {

$('#plus_entity').qtip({
    content: 'This is an active list element</br>This is an active list element',
    show: 'mouseover',
    hide: 'mouseout',
    position: {
        corner: {
           target: 'topRight',
           tooltip: 'topRight'
        }
     },
style: {
     /*classes: 'test'*/
    classes: 'qtip-dark'
 }
});

});

And here is my link: http://jsfiddle.net/hminaee/22v2F/5/

Can anyone help?

Answer 1

you have to change the "position" property. Use "my and "at". like this:

position: {
    my: "bottom left",
    at: "top left",            
    corner: {
       target: 'bottomRight',
       tooltip: 'bottomLeft'
    }
 },

I updated your jsfiddle: http://jsfiddle.net/22v2F/6/