jquery - 为什么 slider 中的最后一个列表不是淡入/淡出/显示/隐藏？

Question

我有一个带有列表内 div 的 easyslider 来显示内容，这样当我将鼠标悬停在一个列表上时，隐藏的 div 通过 fadeIn Fadeout Jquery 显示。

它适用于除最后一个列表之外的所有列表。隐藏内容中的位置不会显示。 有人可以帮忙吗？

有人认为我已经注意到，当我在最后一个列表之后插入一个空白列表时，它似乎起作用了。 这是唯一的解决方法吗？

DropBox 链接:https://dl.dropboxusercontent.com/u/7940498/testtes/bb/01Test_X.html

Jsfiddle:http://jsfiddle.net/newbie_ready_to_learn/kQnFj/1/

<script>
$(document).ready(function() {
    $("#Cont_All1").hover(function(){
        $("#HiddenCont1").fadeIn(700);
},function(){
        $("#HiddenCont1").fadeOut(900);
});

 $("#Cont_All2").hover(function(){
        $("#HiddenCont2").fadeIn(700);
},function(){
        $("#HiddenCont2").fadeOut(900);
});

 $("#Cont_All3").hover(function(){
        $("#HiddenCont3").fadeIn(700);
},function(){
        $("#HiddenCont3").fadeOut(900);
});

 $("#Cont_All4").hover(function(){
        $("#HiddenCont4").fadeIn(700);
},function(){
        $("#HiddenCont4").fadeOut(900);
});
});

</script>


<div>
<li>
<div #Cont_All1>
      <div Img>
      </div>
     Content
      <div #HiddenCont1>
     </div>
</div>
</li>

<li>
<div #Cont_All2>
      <div Img>
      </div>
     Content
      <div #HiddenCont2>
     </div>
</div>
</li>

<li>
<div #Cont_All3>
      <div Img>
      </div>
     Content
      <div #HiddenCont3>
     </div>
</div>
</li>

<li>
<div #Cont_All4>
      <div Img>
      </div>
     Content
      <div #HiddenCont4>
     </div>
</div>
</li>
</div>

Answer 1

我试图删除来自 <li><div id="Cont_All1"> 的第一个 block 第 5 行至 </div></div></li>在第 25 行，问题没有发生。

所以在 jQuery 代码中没有问题，但可能你忘记关闭一些标签或制作一些 id您的 HTML 代码中的错误。所以...我尝试删除第一个 block ，复制第二个 block 并将其重命名为 Cont_All1和 HiddenCont1而不是 Cont_All2和 HiddenCont2工作就完成了，如您所见here .