我目前正试图在某些路径中围绕屏幕移动图像。当它完成一个,它隐藏自己,然后再次移动到起始点等待用户输入并开始下一个。我在Zepto中使用anim函数来做这两个,但是我注意到在隐藏动画时,程序崩溃了。有人可以告诉我如何解决这个问题,或者通过不同的方式移动它或者我需要用anim()做什么?
感谢您的帮助。
答案 0 :(得分:1)
崩溃是什么意思?我猜你在动画完成时使用回调来触发下一步并且你使用display:none
或visibility:hidden
来隐藏你的元素。
如果是这种情况,您遇到的问题是在没有动画发生时不会触发动画回调。回调基于webkitTransitionEnd函数,该函数仅在发生转换时触发。 A)布尔属性(如可见性和B)完全隐藏且未呈现的对象实际上不会发生这些转换。
解决这个问题的最简单方法是永远不要将图像从渲染中移除,使用opacity: 0
将其删除或将其z-index更改为低于所有其他元素。通常,我所做的是有两种状态:{opacity:1, zIndex: 10000}
和{opacity:0, zIndex: -1}
。这样,当对象完全淡出时,它不会阻挡其他元素,并且它会平滑地淡化。 (zIndex从-1到1是在非常低的不透明度下发生的。)