jquery - Skrollr - 任何其他 jQuery 动画冲突

Question

Skrollr 是一个很棒的插件。然而，作为一个初学者，我遇到了一些问题，这些问题似乎是我在这里缺少的一些明显的细节，这不允许我创建任何其他常规的 jQuery 动画来工作。下面是显示问题的测试端的链接:

www.vieckowski.com/test

简单地说。如果我从 index.html 中删除 Skrollr 驱动部分，我可以通过单击白色按钮来设置绿色元素高度的动画。如果我将 Skrollr 驱动部分放回原处，jQuery 将停止处理这些类型的动画。

所以我有一些简单的 HTML，其中第一部分是 skrollr 驱动的:

      <div id="intro-image"
      data-top="transform: translate3d(-65%, 0px, 0px) scale(1.1);"
      data--2500top="transform: translate3d(-50%, 0px, 0px) scale(0.34);"
      data-anchor-target="#section-intro">
      </div>

然后 HTML 使用常规代码，其中我有一个白色按钮，单击绿色部分高度时会产生动画:

 <div class="one">
<div class="one_in"></div></div><div class="two"></div>

我用它来动画元素:

$(".one_in").click(function(){ $(".two").animate({"height":"200px"}) });

我会非常非常感谢您的帮助 - 我的整个项目都取决于这个问题!!!!!!!!

祝一切顺利，

西蒙

Answer 1

!!!解决方案!!!

感谢用户@lonut!!!

每当您使用“z-index”属性分布的多个图层时，您希望启动某些 jQuery 动画的触发元素必须位于顶部。

这意味着它必须具有最高 z-index 属性的样式。

请记住，如果您希望使用“z-index”设置元素样式，则还必须设置 poper“位置”属性，例如相对值。