首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

JavaScript怎么让PNG图片在IE6下面透明

2012-04-14 
【求助】JavaScript如何让PNG图片在IE6下面透明请问下JavaScript如何让PNG图片在IE6下面透明,找过一个CSS的

【求助】JavaScript如何让PNG图片在IE6下面透明
请问下JavaScript如何让PNG图片在IE6下面透明,找过一个CSS的方法,但是可惜只能是指定的图片才会透明,并且支持FF和高版本的IE有点问题!所以就不打算用CSS的了!

哪位朋友有在用的代码请共享一下,并且告诉一下如何调用,在此先谢谢各位了!

补充一下,我在网上找了个“轮播器”代码,要把按钮改成圆形的,想用图片来实现,用GIF不是很现实,希望代码也不会影响到轮播器的JS就好了,麻烦各位了!小弟先谢过


轮播器HTML:

HTML code
<!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=gb2312" /><title>JavaScript ShowImages</title><link href="css/my.css" rel="stylesheet" type="text/css" /><script src="js/my.js" type="text/javascript"></script></head><body><div class="container" id="idTransformView">  <ul class="slider" id="idSlider">    <li><img src="images/01.jpg"/></li>    <li><img src="images/02.jpg"/></li>    <li><img src="images/03.jpg"/></li>    <li><img src="images/04.jpg"/></li>  </ul>  <ul class="num" id="idNum">    <li>1</li>    <li>2</li>    <li>3</li>    <li>4</li>  </ul></div></body></html>


轮播器CSS:
CSS code
@charset "utf-8";.container, .container *{margin:0; padding:0;}.container{width:510px; height:240px; overflow:hidden;position:relative;}.slider{position:absolute;}.slider li{ list-style:none;display:inline;}.slider img{ width:510px; height:240px; display:block;}.num{ position:absolute; right:5px; bottom:5px;}.num li{    float: left;    color: #FF7300;    text-align: center;    line-height: 30px;    width: 30px;    height: 30px;    font-family: Arial;    font-size: 12px;    cursor: pointer;    overflow: hidden;  /**/    margin: 3px 1px;    background-image:url(../images/round1.png);}.num li.on{ /*?*/    color: #fff;    line-height: 30px;    width: 30px;    height: 30px;    font-size: 16px;    margin: 0 1px;    border: 0;    background-image:url(../images/round1.png);    font-weight: bold;}


轮播器JS:
JScript code
var $ = function (id) {    return "string" == typeof id ? document.getElementById(id) : id;};var Class = {  create: function() {    return function() {      this.initialize.apply(this, arguments);    }  }}Object.extend = function(destination, source) {    for (var property in source) {        destination[property] = source[property];    }    return destination;}var TransformView = Class.create();TransformView.prototype = {    initialize: function(container, slider, parameter, count, options) {    if(parameter <= 0 || count <= 0) return;    var oContainer = $(container), oSlider = $(slider), oThis = this;    this.Index = 0;        this._timer = null;    this._slider = oSlider;    this._parameter = parameter;    this._count = count || 0;    this._target = 0;        this.SetOptions(options);        this.Up = !!this.options.Up;    this.Step = Math.abs(this.options.Step);    this.Time = Math.abs(this.options.Time);    this.Auto = !!this.options.Auto;    this.Pause = Math.abs(this.options.Pause);    this.onStart = this.options.onStart;    this.onFinish = this.options.onFinish;        oContainer.style.overflow = "hidden";    oContainer.style.position = "relative";        oSlider.style.position = "absolute";    oSlider.style.top = oSlider.style.left = 0;  },  SetOptions: function(options) {    this.options = {        Up:            true,        Step:        5,        Time:        10,        Auto:        true,        Pause:        2000,        onStart:    function(){},        onFinish:    function(){}    };    Object.extend(this.options, options || {});  },  //start  Start: function() {    if(this.Index < 0){        this.Index = this._count - 1;    } else if (this.Index >= this._count){ this.Index = 0; }        this._target = -1 * this._parameter * this.Index;    this.onStart();    this.Move();  },  //move  Move: function() {    clearTimeout(this._timer);    var oThis = this, style = this.Up ? "top" : "left", iNow = parseInt(this._slider.style[style]) || 0, iStep = this.GetStep(this._target, iNow);        if (iStep != 0) {        this._slider.style[style] = (iNow + iStep) + "px";        this._timer = setTimeout(function(){ oThis.Move(); }, this.Time);    } else {        this._slider.style[style] = this._target + "px";        this.onFinish();        if (this.Auto) { this._timer = setTimeout(function(){ oThis.Index++; oThis.Start(); }, this.Pause); }    }  },  //length  GetStep: function(iTarget, iNow) {    var iStep = (iTarget - iNow) / this.Step;    if (iStep == 0) return 0;    if (Math.abs(iStep) < 1) return (iStep > 0 ? 1 : -1);    return iStep;  },  //stop  Stop: function(iTarget, iNow) {    clearTimeout(this._timer);    this._slider.style[this.Up ? "top" : "left"] = this._target + "px";  }};window.onload=function(){    function Each(list, fun){        for (var i = 0, len = list.length; i < len; i++) { fun(list[i], i); }    };        var objs = $("idNum").getElementsByTagName("li");        var tv = new TransformView("idTransformView", "idSlider", 240, 4, {        onStart : function(){ Each(objs, function(o, i){ o.className = tv.Index == i ? "on" : ""; }) }//Button Style    });        tv.Start();        Each(objs, function(o, i){        o.onmouseover = function(){            o.className = "on";            tv.Auto = false;            tv.Index = i;            tv.Start();        }        o.onmouseout = function(){            o.className = "";            tv.Auto = true;            tv.Start();        }    })        ////////////////////////test2        var objs2 = $("idNum2").getElementsByTagName("li");        var tv2 = new TransformView("idTransformView2", "idSlider2", 408, 3, {        onStart: function(){ Each(objs2, function(o, i){ o.className = tv2.Index == i ? "on" : ""; }) },//Button Style        Up: false    });        tv2.Start();        Each(objs2, function(o, i){        o.onmouseover = function(){            o.className = "on";            tv2.Auto = false;            tv2.Index = i;            tv2.Start();        }        o.onmouseout = function(){            o.className = "";            tv2.Auto = true;            tv2.Start();        }    })        } 



[解决办法]
Google 搜索iepng.js 
我都是用这个的

热点排行