Question

我正在尝试迭代两个或更多层，淡出一个，然后是下一个。一开始，两个图层的样式都是“display：none;” - 因此，在第一个方法调用时，我只是fadeIn（）元素.eq（0） - 之后，我总是fadeOut（）。layer：visible和fadeIn（）。eq（currentSlide）。 currentSlide之前用0初始化，并在每次调用时迭代。

人们会想，这是一个明智的选择。但这是发生的事情：每当动画开始时，第一个元素在两次中消失 - 之后动画按预期运行，但元素的顺序不同。标记中的第一个元素突然是.eq（1），第二个元素是索引.eq（0）。

如果我删除display：none;从图层来看，一切都很完美 - 它必须与可见性设置有关，也可能是一个没有看到图层的选择器？（但.children（）。length（）总是给我正确的数字，但是......）

标记：

<div class="elements">
  <div class="layer"><img src="uploads/pics/one.png" /></div>
  <div class="layer"><img src="uploads/pics/two.png" /></div>
</div>

用coffescript编写的jQuery插件方法：

   if element.find('.layer:visible').length > 0 and element.find('.elements').children().length > 1
    element.find('.layer:visible').fadeOut -> element.find('.elements').children().eq(currentSlide).fadeIn()
  else
    element.find('.elements').children().eq(0).fadeIn()

  # Iterate over slides or reset to zero if last one is reached
  if currentSlide < element.find('.elements').children().length - 1
    currentSlide++
  else
    currentSlide = 0

Answer 1

写作时

element.find('.layer:visible').fadeOut ->
  element.find('.elements').children().eq(currentSlide).fadeIn()

在调用回调之前有一个延迟（默认为400毫秒）。在此期间，调用currentSlide增量代码;因此，eq(currentSlide)会在调用currentSlide时使用该值调用，而不是fadeOut的值。

这是否解释了您遇到的行为？尝试替换

slide = currentSlide
element.find('.layer:visible').fadeOut ->
  element.find('.elements').children().eq(slide).fadeIn()

Answer 2

我的html标记，我认为根据你的咖啡脚本你所拥有的（如果我推断错误，请告诉我）！

<div class="elements">
 <div class="element"></div>
  <div class="layer"><img src="uploads/pics/one.png" /></div>
  <div class="layer"><img src="uploads/pics/two.png" /></div>
 </div>
 <div class="element"></div>
  <div class="layer"><img src="uploads/pics/one.png" /></div>
  <div class="layer"><img src="uploads/pics/two.png" /></div>
 </div>
</div>

jQuery的：

var elementFirstKids = $('elements > element > layer:first-child');
  var elementOtherKids = $('elements > element > layer').not('elements > element > layer:first-child');
   elementFirstKids.fadeIn();
   elementOtherKids.fadeOut();

jQuery .eq（）隐藏元素的问题？

2 个答案: