对于一个项目,我需要一些看起来很像jQuery UI的手风琴功能的功能,但是我不使用jQuery UI。但我注意到我的代码存在的问题也存在于jQuery UI手风琴中。所以我会用它作为例子。
以下是jQuery UI手风琴的链接:http://jqueryui.com/demos/accordion/
如果你注意到,当你点击“第2部分”时,“第4部分”按钮会向上移动几个像素,当动画完成时,它会向下移动几个像素以取回它的位置。我注意到列表中的元素越多,在列表顶部激活动画时“间隙”就越大。
起初,我认为它是由关闭元素的动画不是与开始元素的动画同时开始引起的。但在我用谷歌搜索同时启动两个动画的解决方案之后,我发现我正在使用正确的方法来做到这一点。
然后我认为可能缓和导致了这个问题所以我在animate()中使用了“linear”作为缓动选项。问题仍然存在。
有没有办法解决这个问题?为了确保最后一个元素在2个前面的元素被动画时不会移动?
我在问,因为我很确定我的客户会将其视为烦人的错误。
感谢您的帮助!
答案 0 :(得分:0)
这是相当的解决方法,但如果你找不到更好的解决方案,客户端会坚持修复它,你可以试试这个。就在动画之前,获取所有元素的绝对位置,使其位于要动画的元素之下,并将所有元素设置为绝对元素。动画结束时,恢复位置,顶部和左侧的默认样式值。