javascript - 通过具有部分透明背景的元素触发事件

标签 javascript jquery html css

我被困在解决一个看似简单的问题上。

http://jsfiddle.net/HAKvN/3/

通过单击白色气泡下方的黑框,您将触发一个事件,导致显示警报。

白色气泡代表一个 div,红色边框指示其边界。气泡是保存为带有 Alpha channel 的 PNG 文件的背景图像。

我试图通过单击带有红色边框的框内的透明背景来触发事件(该空间不被气泡本身占据) - 这可能吗?

最佳答案

不幸的是,我不认为这可以轻松完成(也许如果您拥有数组中的所有坐标),替代方案将是这样的: http://jsfiddle.net/HAKvN/4/ (删除边框以获得更好的渲染效果)

编辑:一个稍微好一点的解决方案:http://jsfiddle.net/HjrCE/2/ 。该函数是 infoBoxSplit ,可以在任何 jquery 对象上调用(例如:$('.infoCloud').infoBoxSplit(5);​)。它需要一个参数来指定每一 block 的高度(在本例中为 5px)。边框只是为了展示正在发生的事情。

关于javascript - 通过具有部分透明背景的元素触发事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3620020/

相关文章:

html - 使用 CSS 设计损坏的图像替代文本

javascript - 如何改变网页上文本框的大小?

c# - 如何关闭浏览器上的窗口(ASP.NET MVC)

javascript - Google Apps 脚本 UrlFetchApp 异常

javascript - Chrome 不显示在 HTML 页面中动态加载的外部 JS 文件的更新内容

javascript - HTML5/Javascript 不在屏幕最右侧绘制图 block

javascript - 如果支持 CSS,运行 JS/JQuery

javascript - jQuery 函数中的输入和输出不相等

javascript - 页面加载时平滑的颜色过渡

javascript - 使用 Javascript 或 jQuery 启动和停止 Bootstrap 轮播