【问题标题】:what is the best way to fix IE6 png trancparency with javascript and Jquery用 javascript 和 Jquery 修复 IE 6 png 透明度的最佳方法是什么
【发布时间】:2010-12-26 05:06:30
【问题描述】:

有没有什么简单的方法可以在不使用任何插件或过于复杂的情况下使用 javascript 和 jquery 修复 IE6 PNG 透明度?

【问题讨论】:

  • 有点好奇为什么你不想使用插件
  • 使用检查每个 DOM 节点的插件非常昂贵。最好手动完成。

标签: javascript jquery internet-explorer-6 png transparency


【解决方案1】:

你可以使用这个小插件为你做:

http://jquery.andreaseberhard.de/pngFix/

然而,主要的解决方案是围绕 IE 渲染引擎中包含的过滤器构建的。这些可以通过 css 或 javascript 添加。

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="img.png");

【讨论】:

  • 别忘了background: none之前的filter
【解决方案2】:

【讨论】:

    【解决方案3】:

    我已经成功使用this (IEPngFix)。它是一种自定义行为,您可以通过执行此类操作来使用它...

    <style type="text/css">
        img, div { behavior: url(iepngfix.htc) }
    </style> 
    

    有在线教程是here

    【讨论】:

      【解决方案4】:

      有许多不同的方法可以解决此问题,但解决 IE6 中透明 PNG 问题的最好和最轻松的方法之一是使用 DD_belatedPNG。这个轻量级但功能强大的 Javascript 库为 IE6 添加了透明 PNG 图像支持,大小仅为 5.5KB,因此不会对您网站的加载时间产生太大影响。它的设置很简单,它会修复 CSS 背景图像以及 &lt;IMG/&gt; 元素。

      在此处查看更多详细信息http://www.cre8ivecommando.com/ie6-png-fix-transparent-png-image-support-for-ie6-174/

      【讨论】:

        【解决方案5】:

        jQuery pngfix 插件修复了所有 PNG,这是一个复杂的命题,可能比你需要的更强大。它修复了:

        • IMG 标签
        • CSS 背景图片
        • 图像输入按钮

        要真正回答您的问题,我需要具体了解您需要解决的所有问题。例如,如果您只关心 CSS 背景图像(可能只是在做软阴影),那么我建议您简单地从该插件中复制 n' 粘贴 8 行。

            // fix css background pngs
            jQuery(this).find("*").each(function(){
                var bgIMG = jQuery(this).css('background-image');
                if(bgIMG.indexOf(".png")!=-1){
                    var iebg = bgIMG.split('url("')[1].split('")')[0];
                    jQuery(this).css('background-image', 'none');
                    jQuery(this).get(0).runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + iebg + "',sizingMethod='scale')";
                }
            });
        

        【讨论】:

        • 这是非常昂贵的。最好为单独修改的标记节点分配一个类(例如:class="fix-png")。在我自己的工作中,我发现通常情况下,“手工”方法更合适
        • 实际上并不昂贵,因为您会在特定元素(而不是整个文档)上调用此代码。
        【解决方案6】:

        如果是 IE6,我建议使用透明 gif。在页面加载时,执行browser detect,并根据需要在 javascript 中设置图像 src。

        【讨论】:

        • 在某些情况下使用 GIF 或 8 位 PNG 可能有效,但条件 cmets 和直接 CSS 是为 IE6 实现不同图像的正确方法,而不是 JavaScript + 带有 JavaScript 的浏览器检测。
        • 那要看img是设置在html还是css中
        猜你喜欢
        • 2012-07-27
        • 2010-10-07
        • 1970-01-01
        • 2011-02-07
        • 2011-03-28
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多