通過具有部分透明背景的元素觸發事件

Question

我解決了一個看似簡單的問題。

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

可通過點擊觸發引起警報的事件白色泡沫下的黑盒顯示。

白色的氣泡代表一個紅色邊框表示其邊界的div。氣泡是一個背景圖像保存爲帶有alpha通道的PNG文件。

我想通過點擊一個帶有紅色邊框的盒子裏的透明背景來觸發一個事件（這個空間沒有被泡泡本身佔據） - 它甚至有可能嗎？

Answer 1

不幸的是，我不相信，可以很容易地（也許你曾在陣列中的所有座標）的替代方案是這樣完成的：http://jsfiddle.net/HAKvN/4/（取下邊框，以提供更好的渲染）

編輯：稍好的解決方案：http://jsfiddle.net/HjrCE/2/。該函數是infoBoxSplit，可以在任何jQuery對象上調用（例如：$('.infoCloud').infoBoxSplit(5);​）。它需要一個參數來指定每個塊的高度（在本例中爲5px）。邊界就在那裏展示正在發生的事情。

Answer 2

有人請糾正我，如果我錯了，但我不相信你想要做什麼可以用JavaScript。就腳本而言，PNG是一個方塊。它沒有意識到圖像中的白色氣泡。

如果你想做這樣的事情，你最好的選擇可能會涉及HTML5 canvas元素。