通过DOM图层传递点击事件

问题描述

我有一个div，位于页面的底部，并位于页面上的一切。我包括一个阴影，以删除下面的内容的苛刻截止。但是，我无法点击.container区域中的任何链接，因为我在技术上点击了阴影顶部。

I have a div that is positioned to the bottom of the page and sits above everything on the page. I include a shadow to remove the harsh cutoff of the content below. However, I cannot click any of the links in the ".container" area since I'm technically clicking ontop of the shadow.

有一种方法可以传递事件这个div层并且能够点击containerdiv中的链接？

Is there a way to pass events through this div layer and be able to click links in the "container" div?

<div class="bottom-wrap">
    <div class="shadow"></div>
    <div class="bottom">
      <a href="http://www.google.com" class="#topButton">Click</a>
    </div>
</div>

<div class="container">
    // a bunch of content here
</div>

我创建了这个jsFiddle 这应该有助于了解我的问题。

I've created this jsFiddle http://jsfiddle.net/aY2Ld/ which should help understand my problem.

推荐答案

您可以添加

pointer-events:none;

到您的CSS中的.bottom-wrap类

to your .bottom-wrap class in your CSS

编辑：你还需要添加指针事件：fill;到.bottom类

EDIT : you'll also need to add pointer-events:fill; to the .bottom class

更新的小提琴：

这篇关于通过DOM图层传递点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！