CSS 指针事件=“无”和/或 XUL mousethrough=“始终”在 Firefox 网页中

发布于 2024-08-12 05:32:47 字数 1168 浏览 6 评论 0原文

最近我问了这个问题关于如何传递点击<通过元素(例如全屏覆盖)。收到了一些好的建议,但我仍然想知道哪些浏览器本身支持此功能...

对于那些跳过上一个链接的人,覆盖层纯粹是装饰性的,必须被覆盖并且应该忽略点击(所有鼠标事件都应该通过)直接通过它)...

到目前为止,我只设法在 WebKit 浏览器中使用它。

适用(Chrome 和 Safari 4):-


已知 Firefox 支持 SVG 的指针事件(以及 3.6 中的其他 HTML 元素);问题是,我似乎无法让它与 SVG 一起使用(例如 xlink:href="overlay.24bit.8alpha.png")。

我希望的另一种方式这可以通过使用 XUL in HTML

我希望在叠加层上使用属性 mousethrough="always" 等)。尚未工作...

奇怪的是,Internet Explorer 将 alpha 不透明度 PNG 透明区域视为“点击通过”,这很方便。

在 Firefox (3+) 中实现此目的的任何其他好(或简单但黑客)方法。考虑使用 wmode="transparent" 覆盖 Flash(失败)。

Very recently I asked this question on how to pass clicks through an element (e.g. full screen overlaying ). Received some good advice, but I still wondered which browsers supported this natively...

For those skipping the previous link, the overlay is purely cosmetic, must be overlayed and should ignore clicks (all mouse events should pass right through it)...

So far, I've only managed to get this working with WebKit browsers.

Works (Chrome and Safari 4): -
<image src='./images/75/75.overlay.blood.png' width='100%' height='100%'
style='z-index: 3; position: absolute; top: 0; left: 0; pointer-events: none;' />

Firefox is known to support pointer-events with SVGs (and with other HTML elements in 3.6); problem is, I can't seem to get this to work with an SVG (e.g. xlink:href="overlay.24bit.8alpha.png").

Another way I hoped this could be achieved was by using XUL in HTML.

I'm hoping to use the attribute mousethrough="always" on the overlay (<image>, etc). Not working as of yet...

Oddly enough, Internet Explorer treats alpha opacity PNGs transparent areas as "click through" which is handy.

Any other good (or simple yet hackky) ways to achieve this in Firefox (3+). Pondered a Flash overlay with wmode="transparent" (fail).

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

心意如水 2024-08-19 05:32:47

尝试这个 jQuery 解决方案:http://jsbin.com/uhuto

适用于 Firefox、Chrome、iPad 的 Safari 和 IE8至少。我看到的唯一问题是 IE 中的覆盖层不是半透明的,但我认为这是可以克服的。

另一个解决方案(由 Ext JS 插件使用): http://www.vinylfox .com/forwarding-mouse-events-through-layers/ - 使用 Javascript 重新转发事件。

Try this jQuery solution: http://jsbin.com/uhuto

Works in Firefox, Chrome, iPad's Safari, and IE8 at least. The only issue I saw was that the overlay wasn't translucent in IE, but I assume that's something that can be overcome.

Another solution (used by an Ext JS plugin): http://www.vinylfox.com/forwarding-mouse-events-through-layers/ - uses Javascript to reforward the events.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文