CODEWITHSUNDEEP
jquerycss
cooking good
cooking good

Reputation: 1426

How can i move my popup around?

I've tried using some css styling like so... position: relative; right: 20px;

Here's my fiddle: http://jsfiddle.net/supplement/j77eB/

So when someone hovers over the tooltips link i want the prop to be moved over to the right in stead of the bottom.

$(function () {
    $(document).tooltip({
        position: { my: "left+15 center", at: "right center"}
        content: function () {
            return $(this).prop('title');
        },
        show: null, 
        close: function (event, ui) {
            ui.tooltip.hover(

            function () {
                $(this).stop(true).fadeTo(400, 1);
            },

            function () {
                $(this).fadeOut("400", function () {
                    $(this).remove();
                })
            });
        }
    });
});

Upvotes: 2

Views: 99

Answers (2)

Chankey Pathak
Chankey Pathak

Reputation: 21666

You can use the qTip2 plugin for this.

Demo: http://qtip2.com/demos

Upvotes: 0

Ananthan Unni
Ananthan Unni

Reputation: 1304

As you are using jQuery UI for this, there is a position option available. You can pass it like you have passed the event handlers. Just add the following to the options parameter to the tooltip() function. You can find the fiddle here.

position:{ my: "left+15 center", at: "right center" }

jQuery UI tooltip documentation for position is here.

Upvotes: 2

Related Questions