我正在使用parallax.js
和animate.css
一个项目。我想点击一个红色圆圈来触发一个函数,但是点击事件对它们不起作用(或里面的任何东西)<ul>
图层内的任何东西)。
我现在尝试了很多东西,但没有任何效果。唯一让它工作的是当我删除高度属性时#scene <ul>
但它看起来不正确时。
编辑:当我点击它们时,圆圈应该隐藏起来。就像一层会覆盖它们但什么都没有。
我正在使用parallax.js
和animate.css
一个项目。我想点击一个红色圆圈来触发一个函数,但是点击事件对它们不起作用(或里面的任何东西)<ul>
图层内的任何东西)。
我现在尝试了很多东西,但没有任何效果。唯一让它工作的是当我删除高度属性时#scene <ul>
但它看起来不正确时。
编辑:当我点击它们时,圆圈应该隐藏起来。就像一层会覆盖它们但什么都没有。
您的 Javascript 没有问题
问题是你的<li>
元素掩盖了你的红色圆圈。从视觉上您可以看到它们,但如果您右键单击并Inspect Element
在您的一个圆圈上,它将显示您的最后一个<li>
项目。您还可以通过在控制台中写入来检查您的动画是否正常工作:
$('.c1').click()
您通常可以使用他们的z-indices
. 即,z-index
将您的圈子的值更改为更高,并将z-index
您的其他元素的值设置为更低。
但是,问题似乎是你circle
在一个新<li>
元素中有一个 each。我可以通过以下方式在您的网站上解决此问题:
<div class="circle c1 animated"></div>
<div class="circle c2 animated"></div>
<div class="circle c3 animated"></div>
<div class="square s1"></div>
<div class="square s2"></div>
<div class="square s3"></div>
在一个<li>
元素中,而不是将它们放在单独的元素中。