`
pharaohsprince
  • 浏览: 296844 次
  • 性别: Icon_minigender_1
  • 来自: 南京
文章分类
社区版块
存档分类
最新评论

解决IE浏览器不能正确识别PNG透明度的问题

阅读更多

今天做WEB,切图的时候,因为有透明度图片。开始是在FIREFOX里调试的,正常~
后来,用IE打开后,乖乖变样子了!丑死了~~~
后来写了个JS专门修正IE的问题~
-------------------------

function correctPNG() 
   
...{
   
for(var i=0; i<document.images.length; i++)
      
...{
      
var img = document.images[i]
      
var imgName = img.src.toUpperCase()
      
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
         
...{
         
var imgID = (img.id) ? "id='" + img.id + "" : ""
         
var imgClass = (img.className) ? "class='" + img.className + "" : ""
         
var imgTitle = (img.title) ? "title='" + img.title + "" : "title='" + img.alt + ""
         
var imgStyle = "display:inline-block;" + img.style.cssText 
         
if (img.align == "left") imgStyle = "float:left;" + imgStyle
         
if (img.align == "right") imgStyle = "float:right;" + imgStyle
         
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle        
         
var strNewHTML = "<span " + imgID + imgClass + imgTitle
         
+ " style="" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
         
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
         
+ "(src='" + img.src + "', sizingMethod='scale');"></span>" 
         img.outerHTML 
= strNewHTML
         i 
= i-1
         }

      }

   }

window.attachEvent(
"onload", correctPNG); 



----------------------------
然后,在HEAD里加入
<script type="text/javascript" src="js/pngfix.js"></script>
就OK了!!
备注:IE浏览器如果屏蔽了JS脚本,就可能不起作用了。。要允许JS允许才可以



分享到:
评论

相关推荐

    ie 下png 透明图片 兼容解决方案

    以下是针对IE浏览器PNG透明问题的几种解决方案: 1. **CSS滤镜法**:利用CSS滤镜(Filter)属性,我们可以让IE6支持PNG24的透明。例如: ```css .pngFix { behavior: url(iepngfix.htc); /* 需要一个名为iepng...

    在IE中不显示透明PNG图像纠正控件

    总的来说,这个“在IE中不显示透明PNG图像纠正控件”是一个针对老版本IE浏览器的兼容性解决方案,它通过JavaScript解决了IE5.5和IE6对PNG透明度支持不足的问题,使得网站在这些浏览器中也能呈现出良好的视觉效果。...

    IE6下png透明处理脚本(js)

    VML是一种微软专为IE浏览器开发的矢量图形技术,它允许在IE6中创建具有透明度的元素。 2. **CSS Alpha Transparency Filter**: IE6支持CSS滤镜(Filter)属性,可以用来模拟透明效果。例如,可以使用`filter: ...

    js 解决png图片在IE6下透明问题

    标题提到的“js 解决png图片在IE6下透明问题”是一个典型的老版IE浏览器兼容性问题。PNG格式的图片支持透明度,但在IE6中,PNG-24格式的图片会出现背景透明效果失效的问题,而PNG-8格式则只能支持256色,限制了色彩...

    IE6下PNG背景透明的方法(基于iepngfix.htc).zip

    VML是微软在IE浏览器中引入的一种矢量图形标准,可以处理类似SVG(Scalable Vector Graphics)的矢量图像。当我们在CSS中引入iepngfix.htc,并应用到需要透明效果的PNG元素上,就可以让IE6识别并正确显示PNG的透明...

    JS解决ie6下png透明的方法实例

    最后,文章中的代码示例展示了如何使用JavaScript来修复ie6中PNG透明度问题,并且给出了一种解决方法的实例。这为前端开发者提供了一种快速解决兼容性问题的途径。需要注意的是,随着浏览器市场中ie6所占比例的持续...

    IE6下让图片透明

    总的来说,"IE6下让图片透明"这个主题涵盖了解决旧版IE浏览器与现代网页设计需求冲突的技术,包括CSS行为、HTC文件和JavaScript库的运用。尽管这些方法在当前可能较少使用,但对于理解Web开发历史和技术演进来说,...

    IE多版本模拟器

    "IE多版本模拟器"就是为了解决这一问题而设计的,它允许用户在同一台计算机上同时运行和测试IE5.5到IE10的不同版本,无需安装多个实际的IE浏览器。 **IE浏览器的历史与版本差异** IE浏览器由微软公司开发,自1995...

    DIV+CSS网页中IE和火狐兼容问题的整理

    - IE浏览器对CSS3新属性的支持较晚,如`transform`、`transition`、`border-radius`等。 - Firefox、Chrome等浏览器对CSS3有较好的支持。 解决方法:使用浏览器前缀 `-webkit-`, `-moz-`, `-ms-`, `-o-` 来分别...

    PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)

    总的来说,PNGHandler是解决IE浏览器对PNG透明度支持不足的一个解决方案。它通过JavaScript和IE特有的滤镜技术,使得PNG图像在IE中能够呈现出透明效果,无论是作为普通图像还是背景图像。这个库对于那些需要在老版本...

    各款浏览器图标png和gif两种格式

    综上所述,这个压缩包提供了丰富的浏览器图标资源,包括了主流的IE和火狐浏览器,以及PNG和GIF两种格式,满足了多维度的设计和开发需求。在处理这些图标时,我们需要考虑图像质量、文件大小、透明效果以及设备兼容性...

    突破IE屏蔽限制

    IE浏览器对DOCTYPE的解析方式与其他现代浏览器不同,不正确的DOCTYPE声明可能导致浏览器进入quirks模式,从而引发布局问题。确保使用标准DOCTYPE如`&lt;!DOCTYPE html&gt;`,以确保IE在标准模式下运行。 2. **条件注释**...

    制作改变IE标题栏中的图标软件

    总的来说,这个软件工具帮助用户个性化他们的IE浏览器,通过提供一个简单的方法将PNG图像转换为ICO格式,从而改变标题栏的图标。这个过程涉及图像处理、文件格式转换以及可能的软件安装和配置,对于喜欢定制自己电脑...

    CSS常见浏览器兼容问题

    - IE6的PNG透明度问题:使用`AlphaImageLoader`滤镜解决。 2. Firefox兼容性问题: - Firefox不支持`expression`:这是IE特有的CSS属性,Firefox无法识别。 - Firefox对`min-height`的支持:Firefox可以正确理解...

    中文路径导致unitpngfix.js不正常的解决方法

    在文章中提到的“unitpngfix.js”很可能是一个JavaScript脚本库,用于处理Web页面中的PNG图片透明度等问题,这在早期的IE浏览器版本中尤其常见。IE6是一个著名的旧版浏览器,它对很多现代Web技术的支持并不完善,这...

    IE6_IE7_IE8 CSS 兼容速查表

    3. **透明度支持**:IE6不支持CSS的`opacity`属性,可以使用滤镜(filter)实现透明效果,例如`filter:alpha(opacity=50)`,但请注意这会导致其他非IE浏览器出现问题。 4. **PNG透明问题**:IE6不支持PNG24的透明...

    css规范_IE bug,IE与Firefox的CSS兼容问题.....整理

    IE6的兼容性问题尤为突出,包括PNG透明度支持、浮动元素的双倍边距、CSS表达式等。在可能的情况下,建议升级用户到更高版本的IE,或者使用polyfill库、条件注释提供针对IE6的降级样式。 综上所述,理解和解决CSS在...

    JPG,GIF及PNG各类型的图片格式详细解说

    需要注意的是,旧版IE浏览器在处理PNG图像时可能表现出兼容性问题。 在比较其他图片格式与PNG时,常见的是GIF适合简单的图形和动画,JPEG适合照片,而PNG系列则能够满足这两类需求,特别适合对透明度有特殊要求的...

    javascript登录时判断ie6,分别处理

    - PNG透明度支持不完全,需要使用特定的CSS hack或JavaScript库解决。 4. **事件处理**: IE6使用`attachEvent`方法绑定事件,而非标准的`addEventListener`,所以在添加事件监听器时需要考虑兼容性: ```...

Global site tag (gtag.js) - Google Analytics