How to transition existing divs in yui3 to Overlay bodyContent

StackOverflow https://stackoverflow.com/questions/16471208

  •  21-04-2022
  •  | 
  •  

Question

I've figured out how to create an Overlay, center it, and set it's bodyContent to be an existing from my page. So far so good - now I want to make the transition happen smoothly over 1 full second instead of instantaneously.

The examples I've seen indicate that one must know the initial and final positions, but in this case, I don't know them, since I'm just saying:

overlay.set('bodyContent', Y.one('#node'));
overlay.set('centered', true)

I've created a jsbin at http://jsbin.com/ovuxan/5/edit that shows the issue.. (my transition is whacky to say the least) and would appreciate some help in making it smoother.

Était-ce utile?

La solution

You can use the WidgetAnim plugin to do this for you. It can be cleaner since the animations are stored in the plugin and invoked by the widget's hide/show functions.

I have quickly used the plugin to animate your overlay here: http://jsbin.com/ohafec/1/edit

Helpful links:

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top