jQuery循环:循环div中的链接彼此重叠?

jQuery循环:循环div中的链接彼此重叠?,jquery,css,jquery-cycle,Jquery,Css,Jquery Cycle,Edit:我找到了答案。jQueryCycle插件将z索引添加到它所处理的每个项目中,因此第一个项目总是具有最高的z索引,从而打乱了所有链接。从插件中删除z索引功能已将其修复。 你好 我目前正在使用jquerycycle构建一个循环div,它有一些内部链接。基本上,我们有一个大横幅,然后在这个大横幅中,我有一些绝对定位的div,包含一个产品,一个视频的缩略图,等等。我也有自定义分页 所有这些几乎都非常有效。我现在的问题是,当它旋转到第二个div时,与第一个div处于相同位置的链接优先,并与第二个

Edit:我找到了答案。jQueryCycle插件将z索引添加到它所处理的每个项目中,因此第一个项目总是具有最高的z索引,从而打乱了所有链接。从插件中删除z索引功能已将其修复。

你好

我目前正在使用jquerycycle构建一个循环div,它有一些内部链接。基本上,我们有一个大横幅,然后在这个大横幅中,我有一些绝对定位的div,包含一个产品,一个视频的缩略图,等等。我也有自定义分页

所有这些几乎都非常有效。我现在的问题是,当它旋转到第二个div时,与第一个div处于相同位置的链接优先,并与第二个div的链接重叠,因此对任何用户交互都没有用处

下面是我的代码的基本知识,可以更好地进行布局。对于下面的回答,我也概述了我的职位安排

    #rotation {
         position: relative;
    }

     .rotation_item {
         position: relative;
     }

     .rotation_box {
         position: relative;
     }

<div id="rotation">
<div id="rotation_container">
      <div class="rotation_item" style="background: url('/some/background.jpg');">
             <div class="rotation_box">
                <img src='/image/for/product.jpg' />
                <h3><a href='/product/page/'>Some Cool Product!</a></h3>
             </div>
      </div> 
      <div class="rotation_item" style="background: url('/some/other/background.jpg');">
             <div class="rotation_box">
                <img src='/image/for/other/product.jpg' />
                <h3><a href='/product/page_other/'>Some Other Cool Product!</a></h3>
             </div>
      </div> 
</div>
</div>
旋转{ 位置:相对位置; } .轮换项目{ 位置:相对位置; } .旋转箱{ 位置:相对位置; } 在此场景中,始终显示供单击的唯一链接是
/product/page/


我希望这是有意义的,有人知道我如何使用jQuery Cycle包,或者在每个rotation\u项目上使用一些有趣的CSS设置来防止这种情况发生吗?

我猜您的链接是相对于
rotation\u容器
定位的,而不是
rotation\u项目
,因此,它们在给定的位置上游荡。如果您还没有,请尝试将
位置:相对
添加到
旋转项目
元素的CSS中-这可能会很好地解决您的问题。

我在Cycle Lite插件中遇到了完全相同的问题,这让我发疯……但即使从插件中删除z索引也无助于我的特殊情况(我的内部幻灯片HTML比您上面发布的要复杂一些)

显然,Cycle Lite插件(只包括淡入淡出过渡)和完整的“Cycle All”插件之间存在一些逻辑差异


基本上,解决方案是安装Cycle All插件。从技术上讲,这是一种过分的做法,但我最终在每张图像上有了一个带有单独链接的渐弱幻灯片,而无需修改任何内容。

不幸的是,这没有做到:(我更新了我的主要帖子,更新了我所有当前的CSS相对位置,包括你推荐的位置。感谢你迄今为止的帮助。我们可能需要更多信息。你能获得一个实时演示,或者至少发布你的CSS和/或周期设置吗?我会设置一个演示,谢谢。如果有办法我可以私下联系你,我会将链接发送给你。)我们的暂存站点也有所有的设计。让我知道:)+1现在也投票给你了!我不会在这里发布我的信息,但如果你从我的个人资料开始,也不难找到。这对我也很有用。显然,为了节省一些kb,cycle lite插件不会在幻灯片制作动画后更新z索引。z索引最高的链接将一直显示。使用完整的循环插件修复了这个问题,因为它更新了z-索引,所以当前幻灯片的z-索引最高,从而显示了正确的链接。同样的修复对我有效。如果这个修复被移植到cycle lite插件上,那就太好了