jquery - Change the gravity/position of tipsy tooltip?

Question

Is there some way to edit position or gravity ( I don't know what is correct) of tipsy? The plugin itself has some several options for gravity which you can assign throught script:

nw | n | ne | w | e | sw | s | se

I'm currently using s position, as you can see in the fiddle: http://jsfiddle.net/cnLW8/

But I was wondering if the position of Tipsy can be edited in way that it shows at center of element. Not beside, above or beyond but relative close to center?

Currently, I'm doing this by setting css property of .tipsy class to:

.tipsy{
    margin-top: 30px;
}

But I think that there is some smarter solution, by editing it through the script or something else...

Any help or advice is welcome..

Answer 1

I havent been able to test this but I think adding a new case to the switch block in tipsy.js will do it.

I added case z using the math from s to get the left value and the math from w to get the top value the result should be dead center. Just add the case to your js file and reload it using case z.

switch (gravity.charAt(0)) {
                case 'n':
                    tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
                    break;
                case 's':
                    tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
                    break;
                case 'e':
                    tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset};
                    break;
                case 'w':
                    tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset};
                    break;
                case 'z':
                    tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width / 2 - actualWidth / 2};
                    break;
            }