logo标签列表

如何使用jquery在鼠标悬停在包含多个内部div的容器div上时显示滑块div？

javascriptjqueryhtmlcss
3

我有一个容器，里面包含两个 div 元素 A 和 B

A 包含少量 img 标签，而 B 包含一个幻灯片。

结构如下：

<div id="container">
   <div id="mainCHimage">
      <img id="favIcon">
      <img id="mainImg">
   </div>
   <div id="imageSlider">
      <img class="arrow left">
      <div class="images" id="images_zazzle_tshirts">
        <a href="..344/zazzle_tshirts-v4-en/" rel="attachment wp-att-341"></a>
        <div class="imageHolder catMatchB" style="display: block;">
        <a href="http://santasrecipies.com/344/zazzle_tshirts-v4-en/"></a>
        <a href="http://productUsage.php?prodId=39" target="_blank">
           <div class="sliderImgWrp">
           <img src="../shop/uploads/large/1367904170_link-10351582.jpg">
           </div>
        </a>
        </div>
      </div>
      <img class="arrow right">
   </div>
</div>

我希望图片轮播器能一直保留，直到我鼠标移出整个容器div。但内部div会发生冲突。我已经编写了jQuery函数，您可以在我的演示中查看。请帮帮我...

演示不可用

1
你能解释一下你发布的 fiddle 里面哪里出了问题吗？ - Nelson
1
@Nelson --- http://jsfiddle.net/vaibviad/XepEq/3/ --- 图片滑块默认是隐藏的，当鼠标悬停在块上时，您可以看到两个块垂直向上移动，单击其中任何一个，图像应该可见并保持不变，直到您从整个容器中移出鼠标，该容器是所有包装器。谢谢。 - user2454606
你尝试过使用z-index，使其显示在容器A之上，然后让它检测焦点是否在滑块或容器上吗？如果我理解正确的话，它应该可以工作，但是我的头有点晕。 - Matthew
1个回答
1

不要使用 mouseout 或 mouseover 事件，而是使用 mouseenter 和 mouseleave - 它们仅在进入/离开您附加它们的元素时触发，100％无冲突。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接