0
A
回答
0
這看起來像一個類似的問題,這一個:Hit detection on non-transparent pixel
我想通過獲取與jQuery屬性這也可以對背景圖像進行:
$('#myDiv').css('background-image');
我沒有親自做過,但它似乎是一個可行的解決方案。這隻適用於現代瀏覽器,但您應該能夠使其與excanvas回溯兼容。
0
這是一個調整,但爲什麼你不添加一個類到你的opaque div,並使用JavaScript來檢查它?
在jQuery中:
$('div').mouseover(function(){
if ($(this).is('.opaque')) {
//Some actions
}
});
0
這是可能的,只是不是很容易。你將不得不使用大量的Javascript。
你想附加到你的<div>
的onmousemove事件,它返回光標的X,Y座標。然後,您的事件處理函數將測試以查看光標是否位於正確的位置以觸發替代onmouseover事件。
實現「是光標在不透明像素上嗎?」測試可以通過兩種方式完成:首先是創建一個簡單的數學表達式(例如,如果圖像的不透明部分爲整齊的矩形,圓形或多邊形)。更困難的(和更小的瀏覽器支持的)的方法是將背景圖像加載到畫布對象,然後獲得當前像素值的不透明度圖和從那裏,像這樣:
var pixel = canvas.getImageData(x, y, 1, 1).data;
var alpha = pixel[3]; // assuming RGBA
if(alpha > threshold) onMouseOver(); // raise the event
另一種方法是創建一個完全透明的div(或其他元素),並將其放置並設置大小,使其僅覆蓋下面div的不透明部分,然後測試該元素的框的mouseover
。
相關問題
- 1. CSS懸停與背景圖像和不透明度
- 2. 與CSS3懸停的背景圖像不透明度轉換
- 3. 透明懸停背景
- 4. 懸停時增加透明背景不透明度?
- 5. 在背景顏色前懸停更改透明背景圖像
- 6. 圖像懸停效果開始於黑暗不透明背景
- 7. Bootstrap Jumbotron背景圖像不透明度和寬度和高度?
- 8. 試圖添加背景圖像透明度不透明
- 9. NSButtonCell懸停圖像,點擊透明背景?
- 10. CSS:改變鼠標懸停的背景顏色不透明度
- 11. 懸停時背景顏色的不透明度
- 12. 背景圖像不透明度與父背景顏色
- 13. UIView背景圖像透明度問題
- 14. DIV中的背景圖像透明度
- 15. 懸停不透明度
- 16. 透明背景透明圖像問題
- 17. 懸停,結束和.png圖片透明背景
- 18. 帶有邊框半徑和不透明度的懸停圖像
- 19. 懸停框顏色和圖像不透明度
- 20. 懸停與css過渡和不透明度的閃爍圖像
- 21. 圖像懸停的文本和不透明度更改CSS
- 22. 圖像背景透明GIMP
- 23. 使圖像背景透明
- 24. 透明背景圖像
- 25. 透明背景圖像
- 26. 透明的橫幅和背景不透明的圖像?
- 27. 在背景大小,懸停和不透明的Firefox錯誤
- 28. 圖像透明度和JPanel圖像背景
- 29. 不透明圖像懸停與jQuery
- 30. 當懸停圖像,0.5不透明度爲鏈接的圖像和不透明度爲工具欄提示
「地圖」只能用於圖像嗎? –