JQuery UI drifting position

I have run into an issue with the jQuery UI position() function. If I use it to position a popup menu relative to the element that was clicked, the next time I open the menu, it drifts to the right, even though I am clicking the same element each time.

After googling and trying things, this is what I came up with:

$(“#myMenu”).show().position({my: “left top”, at: “left bottom”, of: e.target, collision: “fit flip”}).hide().delay(600).fadeIn().focus();

That’s a mouthful, huh?

First off, we can’t position a hidden object so we need to show it first. Then, it appears we need to separate the positioning from the animation, so we hide it again, then fade it in. I also put a delay in there so it wouldn’t pop up right away, and then I set focus on the menu.

Since I am newish to jQuery, I don’t really know the significance of separating the positioning from the animation, but here is the link that turned me onto the solution.

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s