之前类似滚动文字两端变淡显示,只能通过在上面覆盖一个透明度渐变的png图片,可是这样的话,当文字滚动到图片下方时,就无法点击了。今天才知道原来css中的pointer-event属性可以解决这种情况。
pointer-events:auto;——这是默认的情况
pointer-events:none;——这样就使该层不会触发鼠标事件,可以被“穿透”
现在支持这一属性的只有Firefox 3.6+, Safari 4 和Google Chrome。
现在新浪微博上也用的这个,IE直接就忽视了。
来源:CSS pointer-Events To Allow Clicks On Underlying Elements
分享到:
相关推荐
是否曾经有过这样的经历:把一个元素置于另一个元素之上,而希望下面的那个元素成为可点击的?现在,利用css的pointer-events属性即可做到。 CSS pointer-events Pointer-events原本来源于SVG,目前在很多浏览器中...
使用该属性可以决定是否能穿透绝对定位元素去触发下面元素的某些行为。如下: 复制代码代码如下:<!DOCTYPE html><html><head><meta charset=”utf-8″><title>CSS:pointer-events</...
现代浏览器里CSS的职责范围和JavaScript的越来越模糊分不清。比如CSS里-webkit-touch-...当使用pointer-events:none,表示它将捕获不到任何点击,而只是让事件穿透到它的下面。代码如下: CSS Code复制内容到剪贴板
MDN 上介绍为 CSS 属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target。 pointer-events 属性值有: /* Keyword values */ pointer-events: auto; pointer-events: none; pointer-events: ...
是否曾经有过这样的经历:把一个元素置于另一个元素之上,而希望下面的那个元素成为可点击的?现在,利用css的pointer-events属性即可做到。 CSS pointer-events Pointer-events原本来源于SVG,目前在很多浏览器中...
pointer-events 是什么? 顾名思义,pointer-events 是一个用于 HTML 指针事件的属性。 pointer-events 可以禁用 HTML 元素的 hover/focus/active 等动态效果。 默认值为 auto,语法: 复制代码代码如下: pointer-...
watermark.js是基于DOM对象实现的BS系统的水印,确保系统保密性,安全性,降低数据泄密风险,简单轻量,支持多属性配置,动态计算水印,水印防被删(监听水印组件元素删除并重新添加,监听改变水印的属性并重新添加...
由于视频控件会将点击事件阻止到Summernote编辑器中,尤其是在Firefox中,因为该事件涵盖了整个视频元素,因此使点击事件完全不可触发。 您可能需要使用以下样式表,以使单击事件直接传递给Summernote编辑器。 ....
1、querySelectorAll() 方法返回文档中匹配指定 CSS 选择器的所有元素 ...8、style.pointerEvents 指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件 9、cloneNode 拷贝一个列表项到另外一个列表
但是,此时大多数浏览器对Pointer Events的本机支持相对较好,请参见 。 该项目现已存档。 入门 将PEP脚本放在文档头中 [removed][removed] 默认情况下,没有从元素发送指针事件。 这最大程度地提高了浏览器可以...