使用 div 进行 Javascript Png 透明度 hitTest 检测

Question

有没有办法通过 hittest 使用另一个 div 作为引用来检测 div png 背景或 png 图像部分是否透明？ 比方说，每次 #char 超过不透明度小于 100% 的像素时，都会检测到并发出警报。有没有办法用 javascript 或 jquery 来解决这个问题？

LIVE DEMO HERE

$(document).ready(function () {

    setInterval(moveChar, 20);
    var keys = {}

    $(document).keydown(function (e) {
        keys[e.keyCode] = true;
    });

    $(document).keyup(function (e) {
        delete keys[e.keyCode];
    });


    function moveChar() {

        for (var direction in keys) {
            if (!keys.hasOwnProperty(direction)) continue;
            if (direction == 37) {
                $("#char").animate({
                    left: "-=5"
                }, 0);
            }
            if (direction == 38) {
                $("#char").animate({
                    top: "-=5"
                }, 0);
            }
            if (direction == 39) {
                $("#char").animate({
                    left: "+=5"
                }, 0);
            }
            if (direction == 40) {
                $("#char").animate({
                    top: "+=5"
                }, 0);
                walk("down");
            }
        }
    }

});

Answer 1

我不确定这是否可行，但我认为它会:

我对这个问题做了相当多的研究，得出的结论是用 JavaScript 创建功能测试是不可行的，IE 6 是唯一不支持的认真使用的浏览器PNG透明度。既然如此，您最好的选择是条件注释，正如 Gabriel Ross 所推荐的那样。可以在纯 JavaScript 中使用条件注释，我认为这就是您想要的:

var div = document.createElement("div");
div.innerHTML = "<!--[if lte IE 6]><i></i><![endif]-->";
var isIe6orLower = (div.getElementsByTagName("i").length == 1);

alert("Is IE 6 or lower: " + isIe6orLower);

See the link