程序员经验分享-hwhale

单击部分透明图像上的透明区域

2024-03-09

Given some shape, I would like it to be clickable on its filled parts, and not clickable (thus clicking through to the element behind it) on its transparent parts. Here's an example of a triangle shape: enter image description here

黑线是边界框线。我希望能够选择文本，或与边界框（绿色轮廓区域）内但未被填充部分覆盖的任何元素交互。

我尝试将 SVG 的指针事件设置为每个可能的值，但它似乎不起作用。首选解决方案将使用 html5、css 和 png 图像，但每个可行的解决方案都受到欢迎。


您可以添加样式属性

指针事件：无

到图像它将帮助您通过图像

注意：它仅适用于现代浏览器

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

css

html

SVG

PNG

单击部分透明图像上的透明区域 的相关文章

  • CSS 显示无不工作

    media screen and min width 900px and max width 1215px menu display none 这不起作用 div 仍然可见 但是 如果我将 div 更改为 div class menu 代替

  • 如何转义 HTML 字符？在.NET中-->“

    如何在 NET 中转义 HTML 字符 我正在从 json 字符串中获取 html 并在标题中得到 amp quot more text 看起来我需要做两次才能得到 amp quot 成为 quot 那么它就是一个 如何转义 NET 中的所

  • 将按钮文本放在一行上

    我的按钮文本在 safari 中显示在一行上 即使在初次单击后 但是在 google chrome 上 当您第一次到达该按 钮时 我的按钮将显示在一行上 但是当您浏览更多帖子并再次遇到 加载更多 按钮时 文本搞砸了 这只发生在谷歌浏览器上

  • 为什么在 JavaScript 中 if([]) 被验证而 [] == false ？

    if false alert empty array is false alert alert 0 if alert empty array is true 他们都会运行警报 Demo http jsfiddle net roine ZFD

  • 为不同的字体系列指定不同的字体大小

    有没有办法为不同的字体系列指定不同的字体大小 我想要使 用的字体 出于产品品牌目的 是一种有点罕见的字体 FlashDLig 并非所有 PC 和浏览器都支持 我的一台带有 IE 9 的 Windows 7 PC 不显示它 现在 对于我使用

  • 如果一个对象结构与另一个对象结构不匹配/不匹配，如何引发异常

    我将读取格式正确的用户输入对象 也就是说 输入对象现在可以具有接口中未定义的任何键或子结构 如果用户提供了无效的对象 我如何抛出异常 预定义接口 export interface InputStructureInterface tableN

  • 如何仅显示/隐藏此 bootstrapvue 表的第二列和第三列？

    下面的代码将显示 隐藏 a 中的所有列BootstrapVue桌子 代码的来源就是这里的答案 使用 bootstrap vue 组件和 bootstrap 3 动态显示 隐藏列 https stackoverflow com questio

  • 如何使跨度标签不可删除？

    我正在尝试使 contenteditable div 内的跨度标记不可删除 div Editable span Read Only span div 只读范围确实是只读的 但我可以通过单击删除键来删除整个范围 有没有一种属性方法可以告诉sp

  • 如何使用 CSS 媒体查询检测设备方向？

    在 JavaScript 中 可以使用以下方式检测方向模式 if window innerHeight gt window innerWidth portrait true else portrait false 但是 有没有一种方法可以仅

  • HTML 代码中的 PHP [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我用 HTML 代码编写了 PHP div div 但这出现在输出页面中 else print 我怎样才能让PHP执行 你的文件有一个 p

  • 内嵌显示定义术语和描述

    我正在为页面上的某些元素使用定义列表 并需要它们内联显示 例如 它们normally看起来像 我需要它们看起来像 注意多个 DD 我可以让它们在 moz 中使用 float 来正常工作 但无论我尝试什么 它们都无法在 IE 中工作 我通常会

  • 如何通过 jQuery 中的类获取特定 html 元素的innerHTML？

    我有这样的 HTML 代码 div class a html value 1 div div class a html value 2 div 我怎样才能访问html value 1 and html value 2使用jquery 分别地

  • 语法错误：意外的标记“？”在 repl.it 上用 JavaScript 制作不和谐机器人时 [重复]

    这个问题在这里已经有答案了 我收到错误 const token this client token this client accessToken SyntaxError Unexpected token Discord 机器人代码 con

  • 如何在画布上所有其他内容后面绘制图像？ [复制]

    这个问题在这里已经有答案了 我有一块画布 我想用drawImage在画布上当前内容后面绘制图像 由于画布上已经有内容 我正在使用字面上的画布来创建包含图像的画布 因此我无法真正先绘制图像 所以我无法使用drawImage在我呈现其余内容之前

  • Service Worker 与 Shared Worker

    Service Worker 和 Shared Worker 有什么区别 我什么时候应该使用 Service Worker 而不是 Shared Worker 反之亦然 Service Worker 具有共享 Worker 之外的附加功能

  • 为什么 Node.js 应用程序只能从 127.0.0.1/localhost 访问？

    我本来打算教我的朋友介绍 Node 但是后来 我想知道为什么这个代码来自nodejs org var http require http http createServer function req res res writeHead 20

  • ThreeJS 中阴影的奇怪行为

    所以我有一个 ThreeJS 场景 并且添加了一些球体 多材质 我还添加了定向光 this light new THREE DirectionalLight 0xFFFFFF 1 this light position set 2 10 2

  • Jwt 签名和前端登录身份验证

    我有这个特殊的 jwt sign 函数 Backend const token jwt sign id user id process env TOKEN SECRET expiresIn 1m res header auth token

  • 确定 Javascript 中的日期相等性

    我需要找出用户在 Javascript 中选择的两个日期是否相同 日期以字符串 xx xx xxxx 形式传递给该函数 这就是我需要的全部粒度 这是我的代码 var valid true var d1 new Date datein val

  • 将多维数组转换为单数组（Javascript）

    我有一个对象数组 来自 XLSX js 解析器 因此其长度和内容各不相同 表示已给予项目的资助 简化后 它看起来像这样 var grants id p 1 location loc 1 type A funds 5000 id p 2 lo

随机推荐

  • Django 模型继承 - 在查询中只需要父类的实例

    假设我有 2 个模型 一个是另一个的父模型 如何查询 Django 中所有不是餐厅的地点 Place objects all 将包括所有餐厅 对吗 我想将孩子排除在结果之外 谢谢你 class Place models Model name

  • 将多个不相邻列复制到数组

    我正在尝试将多个不相邻 不连续 的 Excel 列复制到数组中 但它不起作用 以下是我尝试过的 Public Function Test Dim sh As Worksheet Set sh Application Sheets MyWor

  • Response.End 之后关闭窗口

    例如我有一个表格ListView即处于编辑模式 发生了一些事情 导致列表视图正在使用的表不再可用 我只想在用户点击 保存 时能够关闭窗口 In Page Load 我检查桌子是否可用 如果没有 我打电话RegisterClientScrip

  • Visual Studio 设计器中的抽象 UserControl 继承

    abstract class CustomControl UserControl protected abstract int DoStuff class DetailControl CustomControl protected over

  • Django：如果用户是工作人员，如何排除表单字段？

    如果用户不是员工 如何排除表单字段 我尝试了这个 但没有成功 给出了一个错误 global name user is not defined class PostForm ModelForm class Meta model Photo e

  • API 来比较 AST？ [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 是否有一个开源java api允许比较java源代码的两个抽象语法树 我想看看两个语法树之间的差异 类

  • 关键字 CONSTRAINT 在此 CREATE TABLE 语句中起什么作用

    我正在学习如何将 sqlite3 与 python 一起使用 我所关注的教科书中的示例是一个数据库 其中每个国家 地区记录都有一个地区 国家 地区和人口 书上说 以下代码片段使用 CONSTRAINT 关键字来指定 表中没有两个条目是 所创

  • 使用 Javascript 的 8 位异或校验和

    我正在尝试模仿 Windows 应用程序格式化消息并发送通过 USB 通过 UART 传输到显示该消息的设备 该应用程序计算checksum并将其粘贴到消息后面 否则设备将不会接受该命令 校验和不是 crc8 校验和 但它是什么 使用 US

  • 使用 powershell 从路径获取最新创建的文件夹

    如何使用 Windows PowerShell 从路径获取最新创建的文件夹 我有路C temp我想在此路径中找到最近创建的文件夹 PowerShell 主要与管道一起工作 因此您编写的大部分内容将包括创建表示某些信息的对象 以及过滤和操作它

  • 查找最近一小时内产生的记录

    我有一个smalldatetime字段命名myTime创建记录时进行记录 我需要选择过去一小时内创建的记录的语法 我认为会是 and DATEDIFF hh datePart hh myTime DatePart hh GETDATE lt

  • 是否可以保留自定义元素的内部 html？

    使用自定义元素 我想对自定义元素内的元素进行样式设置 但是当我定义该元素时 除了影子 dom 之外的所有内容都会消失 如何将内容从元素移动到 Shadow dom 我已经有一个包装元素 div class wrapper 在阴影内 但尝试使

  • Keras：将预测与使用标准化数据训练的模型结合使用？

    我正在 Keras 中创建一个深度神经网络 以使用表格数据执行 NN 回归 最佳实践是标准化输入和输出序列 我也想使用predict函数提供各种输入集的模型输出估计 如果训练数据已标准化 我想我还需要标准化predict使用相同的缩放参数的

  • 温莎城堡延迟加载服务

    有时 我发现自己处于这样的情况 只有在满足特定条件时才需要解决服务 例如 用户可以选择发送电子邮件或短信通知 我想根据用户的选择来延迟加载电子邮件或短信服务 这样我就不必同时加载它们并浪费资源 例如 如果用户有 10 个选项怎么办 我遇到的

  • Node.js Express - 如何将 Stylus .styl 文件编译为 CSS

    我正在尝试从 Balloons http balloons io 开始构建一个应用程序 它使用 Backbone js 和 Express 来设置 UI 我从未使用过这些框架 而且我很难真正做出改变 据我了解 styl 文件被编译成 CSS

  • /etc/lsb-release 与 /etc/os-release

    我需要使用 bash 找出我正在运行的 Linux 发行版 成立这一页 https www cyberciti biz faq find linux distribution name version number 这非常有帮助 但是我的系

  • XSLT 和 xpath v1.0 查找重复项并聚合

    我想知道是否有一种方法可以在 xml 中搜索重复项 然后在找到时将所有重复项聚合到一个节点 埃克斯

  • 为什么我的 PDO 不起作用？

    我开始使用 PDO 并使用 PDO 成功连接到 MySQL 但是 当我尝试从数据库中选择内容时 什么也没有发生 没有任何回声 即使我在该表中有记录 并且列 username 存在 我的 PHP 日志中没有错误 我正在使用 MAMP 并且所有

  • 如何在 Objective-C 中编写调用 `super` 实现的 c 函数？ [复制]

    这个问题在这里已经有答案了 我需要实现一个通用 C 函数 它将调用super的实现并返回值 我将在运行时将此函数注入到目标类中 目标选择器的参数数量可以是任意数量 并且只有在运行时才知道 我实现了一个C函数 如下所示 但我不知道如何调用su

  • 根据另一个数组的值对 JS 数组进行排序的最快方法？

    有一些类似的帖子 但我找不到任何可以完全解决这个特定问题的内容 我有两个配对值数组 var A 0 5 0 6 0 5 0 7 0 8 0 1 var B a b c d e f note a 0 5 b 0 6 c 0 5 d 0 7 e

  • 单击部分透明图像上的透明区域

    Given some shape I would like it to be clickable on its filled parts and not clickable thus clicking through to the elem

热门标签