鼠标悬停.animate停止在.animate之前 [英] Mouseover .animate stops prior .animate

问题描述

我有两个不同的.animate函数.

I have two different .animate functions..

1. 向下滑动准备就绪的文档上的元素.
2. 将鼠标悬停效果添加到这些相同的元素.

这里的问题是，如果您恰好将鼠标悬停在元素在文档上滑入的区域上，它们将停在您鼠标所在的位置.

Problem here is that IF you happen to have your mouse over the area where the elements slide in on document ready, they will stop in the position where your mouse was in.

当然，目标是让元素自行滑动而不会受到干扰.

The goal of course is to let the elements slide on their own without any interruptions.

http://photoshopmesta.net/sic/theTest/slide.html

另一件事.. Mouseleave似乎将元素移到比鼠标悬停前稍高的位置...

Another thing.. the mouseleave seems to move the element slightly higher position than it was before the mouseover...

关于图像加载的任何想法吗?我在其中放置了代码，将图像文件加载到准备就绪的文档中.它以最快的速度加载图像，但是我没有想到，无论是否加载图像，元素仍然会滑动..当然，在滑动动作之前不会加载这些元素..:/

Any ideas on the image load? I put code in that loads the image file on document ready. It loads the images as fast as it is able to, but i didnt think of it that the elements will still slide no matter if the image is loaded or not.. and of course theyre not loaded before the sliding action.. :/

感谢@entropo的工作示例 http://jsfiddle.net/PnHpk/7/ ，尽管可能是一段时间后图像从那里消失了，所以这里以彩色背景而不是图像为例推荐答案

我将您的示例放在jsfiddle中: http ://jsfiddle.net/entropo/PnHpk/

I put your example in jsfiddle: http://jsfiddle.net/entropo/PnHpk/

在此处提问时，这是一个好习惯，因为它可以帮助人们通过一个可行的例子来回答您.

This is a good practice when asking questions here because it helps people answer you with a working example.

这是我的想法: http://jsfiddle.net/entropo/PnHpk/7/

我利用jQuery 1.5的新Deferred对象.
请参阅: SO'[jquery] deferred'搜索

I take advantage of jQuery 1.5's new Deferred objects.
See: SO '[jquery] deferred' search

此外，这也不是我所做的(我更喜欢使用push来生成Promise堆栈)，但这很有用:

Also, this isn't exactly what I did (I preferred using push to make a Promise stack), but this is helpful: Deferred promises and synchronizing jquery.animate()

这篇关于鼠标悬停.animate停止在.animate之前的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！