html – 使用Alpha通道点击div

我正在尝试在feed小部件的底部复制twitter的“淡出”图层(在twitter.com的主页上).

我想出的唯一没有使用html5的方法就是在feed div之上放置一个绝对定位的div,并给它一个alpha通道的png,上面有一个白色到透明的渐变.这很容易实现.

现在唯一的问题是透明层下面出现的div不可点击.
有关如何使div可点击的任何想法？也许你有另一种方法可以完全复制这种效果？

谢谢！

解决方法

Forwarding Mouse Events Through Layers：

1. The textarea (my masking element) that
   is positioned over the grid receives
   mouSEOver,mousemove,mousedown,
   mouseup and other events.
2. The top
   masking layer is hidden for a moment,
   so we can figure out what element is
   below the mask at the event location.
3. The event is re-fired – this is where
   the W3 DOM Event model and the simpler
   Microsoft equivalent come into play.
4. Start the process again – ready for
   the next event.

编辑：我认为Twitter的作用实际上要简单得多.有一个从SVG借来的CSS属性已经实现了一堆浏览器.

.overlay { pointer-events: none; }

目前Firefox 3.6,Safari 4和谷歌浏览器都支持这一功能 – 所以如果你很高兴它只能在这些浏览器上工作,那么这是一个更简单的选项,还有一个额外的优势,它也适用于悬停事件,而不仅仅是点击活动.

（编辑：晋中站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!