问题描述
链接: http://jsfiddle.net/kbJCc/1/
不幸的是,现在我什至无法使用jquery执行最简单的动画.我有一个分为4个按钮的二次div.每个按钮代表屏幕的一个角.因此,如果按btn1,我的Quaddiv div应该设置为左上角的动画.btn2应该使div动画到右上角. btn3左下角.
Unfortunately I can't even perform the most simple animation with jquery right now.I've got a quadratic div separated in 4 buttons. Each button represents one corner of my screen. So if I press btn1 my quadrativ div should animate to the upper-left corner.btn2 should animate the div to the upper-right. btn3 bottom left a.s.o.
现在有两个问题:1. Safari和amp;中的动画不流畅镀铬(它从一个角跳到另一个角)2.如果单击全部(在上一个动画之后单击一个),则div卡在左上角.
Now there are two problems:1. animation is not smooth in safari & chrome (it jumps from one corner to an other)2. If I have clicked all (one after the previous animation) the div is stuck in the upper left corner.
Firebug告诉我,我的div保留了$ .animate()应用的所有css规则?!
Firebug told me that my div keeps all of the css rules applied by $.animate()?!
希望这里有人可以帮助我.
Hopefully someone out here can help me.
非常感谢您.
顺便说一句. div最初应该位于我的窗口中心:)
Btw. the div initially should have been centered on my window :)
推荐答案
我已经更新了您的jsfiddle .基本上,我给出了包含main-menu
静态尺寸的元素,以便JavaScript可以从中计算位置.然后,一旦DOM准备就绪,我便通过JavaScript将main-menu
元素初始化为文档的中心"(从技术上讲,这可以并且应该在样式表中完成).最后,我更新了您的动画以显式设置main-menu
元素的所有侧面的动画.
I have updated your jsfiddle. Basically, I gave the element containing main-menu
static dimensions so that the JavaScript has something from which to calculate positions. I then initialized the main-menu
element to the "center" of the document via JavaScript once the DOM is ready (technically, this could, and should, be done in the stylesheet). Finally, I updated your animations to explicitly animate all sides of the main-menu
element.
这篇关于jQuery动画div到每个角均以跳动动画结尾,并且' fixed'元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!