HTML/CSS:使 div“不可见"点击? [英] HTML/CSS: Make a div "invisible" to clicks?
问题描述
出于各种原因,我需要在一些文本上放置一个(大部分)透明的
例如,overlay
div覆盖了文本,但我希望能够通过overlay
div来点击/选择文本:
<p>一些文字</p><div id="overlay" style="position: absolute; top: 0;左:0;宽度:100%;高度:100%">……一些内容……
可以使用 CSS 指针事件
.Firefox 3.6+、Chrome 2+、IE 11+ 和 Safari 4+ 支持此属性.不幸的是,我不了解跨浏览器的解决方法.
#overlay {指针事件:无;}
For various reasons, I need to put a (mostly) transparent <div>
over some text. However, this means that the text can't be clicked (eg, to click links or select it). Would it be possible to simply make this div "invisible" to clicks and other mouse events?
For example, the overlay
div covers covers the text, but I would like to be able to click/select the text through the overlay
div:
<div id="container">
<p>Some text</p>
<div id="overlay" style="position: absolute; top: 0;
left: 0; width: 100%; height:100%">
... some content ...
</div>
</div>
It can be done using CSS pointer-events
. This property is supported in Firefox 3.6+, Chrome 2+, IE 11+, and Safari 4+. Unfortunately, I don't have knowledge of a cross-browser workaround.
#overlay {
pointer-events: none;
}
这篇关于HTML/CSS:使 div“不可见"点击?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!