<a>不能在<li>中单击parallax.js

Question

我正在使用parallax.js (http://wagerfield.github.io/parallax/)脚本来动画页面上的一些元素，如下所示：

http://harbourcityseo.com/responsive/seo/。

当我将文本放置在< ul >标记之外时，链接将正常工作。但他们变成了..。当嵌套在设置视差层的标签内时，不可点击。

浮动在页面顶部的文本是我试图排除故障的文本(它嵌套在视差层中，只是没有定位)。

<section role="main">
    <ul id="scene" 
        data-invert-x="true" 
        data-calibrate-x="false"
        data-limit-x="0"
        data-limit-y="10"
        class="scene">
    <li class="layer" data-depth="0.1"></li>
    <li class="layer" data-depth="0.2"></li>
    <li class="layer" data-depth="0.1"></li>
    <li class="layer" data-depth="0.3"></li>            
    <li class="layer" data-depth="0.5">
            <p>Like <a href="#" class="myButton">this</a>. Bacon <a href="http://www.google.com">ipsum dolor sit amet corn sourdough</a> multigrain brioche, rye scone biscuit naan tortilla potato bun muffin bagel focaccia croissant. Muffin bun sourdough tortilla bagel scone. Cracker wholegrain matzo banana sourdough bagel ciabatta muffin multigrain lavash panettone olive white garlic potato. Croissant wholegrain potato quick boule scone sourdough ciabatta cracker panettone naan bun roll. Ciabatta panettone pita scone rye.</p>          
            </li>
    <li class="layer" data-depth="0.1"></li>
    <li class="layer" data-depth="0"></li>
    </ul> 
 </section>

Answer 1

为此使用z-索引。

.layer 
{ 
   z-index: 100; 
}