当运行像 slideDown() 这样的 Jquery 动画时,看起来许多特定于元素的 css 属性被设置为以特定间隔更新,并且当动画完成时,这些属性被取消设置并且显示属性被简单地设置为 auto 或任何。至少在萤火虫中,您再也看不到那些临时属性了。
我遇到的问题是我们使用 stop() 停止向下滑动的场景。然后该元素将保留当前的临时 css 值。这很好,因为它必须这样做,但是让我们说我停止了向下滑动,因为我决定过早地将它再次向上滑动。它看起来像这样:
$(this).slideDown(2000)
//The below events is not in queue but will rather start execute almost
simultaneously as the above line. (dont remember the exact syntax)
$(this).delay(1000).stop().slideUp(2000)
上面的代码可能没有多大意义,但重点是:
向下滑动 1 秒后,动画停止并开始向上滑动。奇迹般有效。
但!!!这就是问题所在。一旦它向后滑动,元素 css 属性将重置为它在 slideDown() 动画中 1000 毫秒的确切值(当调用 stop() 时)。如果我们现在尝试运行以下命令:
$(this).slideDown(2000)
它将向下滑动到先前的 slideDown 被中止的点,并且不会以一半的速度进一步滑动(因为它在大约一半的高度上使用相同的时间)。这是因为我看到的 css 属性已保存。但这并不是特别希望的。当然,这次我希望它一直向下滑动。
由于难以预测的 UI 交互,一切可能很快就会中断。我们使用较长的动画会增加发生此类事情的风险。
这被认为是一个错误,还是我做错了什么?或者也许它只是一个不受支持的功能?
我想我可以使用回调函数来重置 css 属性,但是根据所使用的动画,不同的 css 属性用于渲染它,并且覆盖你的背部会导致一个不那么花哨的解决方案。