2

编辑：我想通了。jQuery Cycle 插件为它处理的每个项目添加了一个 z-index，因此第一个项目总是具有最高的 z-index，从而弄乱了所有链接。从插件中删除 z-index 功能已修复它。

你好呀，

我目前正在使用具有一些内部链接的 jQuery 循环构建一个循环 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_item 上的一些有趣的 CSS 设置？

4

2 回答 2

3

我与 Cycle Lite 插件有完全相同的问题，它让我发疯......但即使从插件中删除 z-index 也无助于我的特殊情况（我的内部幻灯片 HTML 比你的复杂一点贴在上面）。

显然 Cycle Lite 插件（仅包括淡入淡出过渡）和完整的“Cycle All”插件之间存在一些逻辑差异。

基本上解决方案最终是安装 Cycle All 插件。从技术上讲，这有点矫枉过正，但我​​终于有了一个褪色的幻灯片，每个图像上都有单独的链接，而无需破解任何东西。

于 2011-03-30T17:29:33.763 回答
1

我的猜测是你的链接是相对于rotation_container而不是定位的rotation_item，因此在它们的给定位置上徘徊。如果您还没有，请尝试position: relative为您的元素添加 CSS rotation_item- 这可能会很好地解决您的问题。

于 2010-07-30T16:45:26.443 回答