Question

我正在使用this script进行IE6的PNG修复。

我注意到，当我克隆一个元素时，克隆的PNG是不固定的，即使它们附加了适当的类，我也无法重新应用修复。我正在使用jquery来克隆一个元素，并且由于广泛的原因必须使用clone（false，false）...是否有一种方法可以在附加克隆后将修复应用于新元素？再次调用DD_belatedPNG.fix（“。pngfix”）似乎不起作用。

Answer 1

不要使用png修复，只需使用IE支持的透明PNG（使用alpha调色板8位）。如果您使用的是Mac，ImageAlpha会为您执行此操作，否则您可以使用pngquant（ImageAlpha所基于的）为您执行此操作。

不需要Javascript / IE Filter类型的东西来解决这个问题，应该避免使用。

Answer 2

此解决方案适用于img元素

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
    body {
        background:#0000FF;
    }
</style>
<script type="text/javascript" language="javascript" src="jquery.min.js"></script>
<script type="text/javascript" language="javascript" src="DD_belatedPNG_0.0.8a.js"></script>
<script>
    $(document).ready(function () {
        function imageClickHandler () {
            var $newA = $("<a></a>")
            var $newImg = $(this).find('img').clone(false,false);
            $newImg.attr("style","");
            $newA.append($newImg);

            $newA.click(imageClickHandler);
            $(this).parent().append($newA);
            DD_belatedPNG.fix('img');
        }

        DD_belatedPNG.fix('img');
        $('a').click(imageClickHandler);

    });
</script>
</head>
<body>
<a><img src="image.png" /></a>
</body>
</html>

修改这个解决方案适用于bg元素

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> body { background:#0000FF; } a { display:inline-block; //display:inline; zoom:1; width:512px; height:512px; background:url(image.png) no-repeat center center; text-decoration:none; outline:none; } </style> <script type="text/javascript" language="javascript" src="jquery.min.js"></script> <script type="text/javascript" language="javascript" src="DD_belatedPNG_0.0.8a.js"></script> <script> $(document).ready(function () { function imageClickHandler () { var $newA = $(this).clone(false,false); $newA.removeAttr("style isImg vmlInitiated vmlBg"); $newA.click(imageClickHandler); $(this).parent().append($newA); DD_belatedPNG.fix('a'); } DD_belatedPNG.fix('a'); $('a').click(imageClickHandler); }); </script> </head> <body> <a></a> </body> </html>

PNG修复新元素

2 个答案: