[已解决]IE6下PNG背景透明问题怎么解决？
时间：2008-11-22
来源：互联网
我知道你们会建议我去搜索，但是请相信我肯定是找不到解决办法才上来的！
用filter的直接就透明了，控制不了透明度，再说了，我要的不是控制透明度，而是实现我给出的PNG图片透明度，也就是效果达到和FF之类的正常效果。
还有朋友说直接建一个透明度和PNG透明度一样的GIF文件，在IE6下用，好吧，有高手能告诉我一下怎么建立透明的GIF文件吗？PS里面存为GIF文件时怎么设置选项？或者说是用的其它的软件，那也请告诉我一下吧？
对了，我的PNG图片是用来作为导航栏背景的，那种repeat-x的效果，先谢谢了。
[ 本帖最后由 sfrost 于 2008-11-23 02:38 编辑 ]
用filter的直接就透明了，控制不了透明度，再说了，我要的不是控制透明度，而是实现我给出的PNG图片透明度，也就是效果达到和FF之类的正常效果。
还有朋友说直接建一个透明度和PNG透明度一样的GIF文件，在IE6下用，好吧，有高手能告诉我一下怎么建立透明的GIF文件吗？PS里面存为GIF文件时怎么设置选项？或者说是用的其它的软件，那也请告诉我一下吧？
对了，我的PNG图片是用来作为导航栏背景的，那种repeat-x的效果，先谢谢了。
[ 本帖最后由 sfrost 于 2008-11-23 02:38 编辑 ]
作者: sfrost 发布时间: 2008-11-22
复制内容到剪贴板
<style type="text/css">
.shadow div {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="png图片地址",sizingMethod='crop');
width:1px;
background:none;
}
</style>
<![endif]-->
代码:
<!--[if gte ie 6]><style type="text/css">
.shadow div {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="png图片地址",sizingMethod='crop');
width:1px;
background:none;
}
</style>
<![endif]-->
作者: HeTingYi 发布时间: 2008-11-22
先谢谢，但是这个功能实现的效果就是整个导航条变为透明的了，而我要的透明度是根据PNG图片来决定的，或者说，能自定义透明度也可以！
作者: sfrost 发布时间: 2008-11-22
单独存成一个JS文件,然后调用.
复制内容到剪贴板
{
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
}
}
}
function alphaBackgrounds(){
var rslt = navigator.appVersion.match(/MSIE (d+.d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (i=0; i<document.all.length; i++){
var bg = document.all[i].currentStyle.backgroundImage;
if (bg){
if (bg.match(/.png/i) != null){
var mypng = bg.substring(5,bg.length-2);
//alert(mypng);
document.all[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+mypng+"', sizingMethod='crop')";
document.all[i].style.backgroundImage = "url('')";
//alert(document.all[i].style.filter);
}
}
}
}
if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {
window.attachEvent("onload", correctPNG);
window.attachEvent("onload", alphaBackgrounds);
}
代码:
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
}
}
}
function alphaBackgrounds(){
var rslt = navigator.appVersion.match(/MSIE (d+.d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (i=0; i<document.all.length; i++){
var bg = document.all[i].currentStyle.backgroundImage;
if (bg){
if (bg.match(/.png/i) != null){
var mypng = bg.substring(5,bg.length-2);
//alert(mypng);
document.all[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+mypng+"', sizingMethod='crop')";
document.all[i].style.backgroundImage = "url('')";
//alert(document.all[i].style.filter);
}
}
}
}
if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {
window.attachEvent("onload", correctPNG);
window.attachEvent("onload", alphaBackgrounds);
}
作者: HeTingYi 发布时间: 2008-11-22
还是全透明的了。
要不你们教下我怎么创建透明的GIF文件吧？说是GIF的透明度在IE6下可以用。
要不你们教下我怎么创建透明的GIF文件吧？说是GIF的透明度在IE6下可以用。
作者: sfrost 发布时间: 2008-11-22
GIF只支持1级透明，即完全透明和完全不透明。没有255个透明度级别。
给你上传个附件吧！解决PNG透明的问题。
alpha.zip (19.34 KB)
[ 本帖最后由 yoom 于 2008-11-22 22:17 编辑 ]
给你上传个附件吧！解决PNG透明的问题。
alpha.zip (19.34 KB)
[ 本帖最后由 yoom 于 2008-11-22 22:17 编辑 ]
作者: yoom 发布时间: 2008-11-22
首先非常感谢你的这个DEMO，让我想起了我的问题该怎么解决，同时也感谢楼上的各位哈！
作者: sfrost 发布时间: 2008-11-23
非常感谢#6
作者: ilsanbao 发布时间: 2010-09-23
相关阅读 更多
热门阅读
-
office 2019专业增强版最新2021版激活秘钥/序列号/激活码推荐 附激活工具
阅读：74
-
如何安装mysql8.0
阅读：31
-
Word快速设置标题样式步骤详解
阅读：28
-
20+道必知必会的Vue面试题（附答案解析）
阅读：37
-
HTML如何制作表单
阅读：22
-
百词斩可以改天数吗？当然可以，4个步骤轻松修改天数！
阅读：31
-
ET文件格式和XLS格式文件之间如何转化？
阅读：24
-
react和vue的区别及优缺点是什么
阅读：121
-
支付宝人脸识别如何关闭?
阅读：21
-
腾讯微云怎么修改照片或视频备份路径?
阅读：28
