这个根本不用js，用css就可以了，支持IE5.5以上和firefox。
成都创新互联专业为企业提供嘉陵网站建设、嘉陵做网站、嘉陵网站设计、嘉陵网站制作等企业网站建设、网页设计与制作、嘉陵企业网站模板建站服务，10年嘉陵做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=gbk" /
title透明度变化/title
style type="text/css"
!--
.highlightit img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-moz-opacity: 0.5;
}
.highlightit:hover img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity: 1;
}
--
/style
/head
body
a href="" class="highlightit"img border="0" src="test1.gif"/a
a href="" class="highlightit"img border="0" src="test2.gif"/a
/body
/html
这种透明指示层的外观效果是用CSS写的，javascript只是实现让这样的层显示出来。
用CSS写的话，要用到opacity，rgba这类有半透明效果的属性，外观做完后，让做好的透明指示层隐藏，需要弹出时，用javascript设置其显示方式为可见即可。当然，用jQuery做弹出效果的话会更炫。
function touming(elem, value)}{
if( typeof elem === "string" ){
elem = document.getElementById(elem);
}
if( typeof value !== "number" ){
value = parseFloat( value );
}
elem.style.filter = 'alpha(opacity=' + value + ')';
elem.style.opacity = value / 100;
}
img id="tm" src="...." /
script
touming("tm", 40);
/script
div id="con_one_2" style="display:none"新闻列表2/div
input type="button" name="Submit" id="add" value="add" onclick="AddRow()"/
script language="javascript"
function AddRow()
{
if(document.getElementById("con_one_2").style.display=="none")
{
document.getElementById("con_one_2").style.display="block";
document.getElementById("add").value="delete";
}
else
{
document.getElementById("con_one_2").style.display="none";
document.getElementById("add").value="add";
}
}
/script
这样：
script language="javascript"
function hide(id)
{
if(document.getElementById(id).filters.alpha.opacity = 0)
{
document.getElementById(id).filters.alpha.opacity -= 5;
window.setTimeout("hide(\"" + id +"\")", 100);
}
}
/script
扩展资料：
注意事项
此外对于透明度有一点要说明一下，就是在IE中在css中设置透明度的方式filter:alpha(opacity:value)其中value值从0~100;
透明度可以通过opacity：value来设置，其中value=0~1.
代码如下：
!DOCTYPE html
html
head
titlejs动画事件/title
link href="move.css" rel="stylesheet" type="text/css"/
script type="text/javascript" src="move.js"/script
/head
body
div id="div1"
/div
/body
/html
div id="obj" style="width:100px; height:100px; background:#000;"/div
button id="btn" onclick="fadeout()"按钮/button
script
function fadeout(){
var opacity = 1;
var timer = null;
timer = setInterval(function(){
opacity = opacity - 0.05;
if(opacity0){
document.getElementById('container').style.opacity = opacity;
}else{
document.getElementById('container').style.opacity = 0;
clearInterval(timer);
}
}, 150);
}
/script
其实这个最好用setTimeout递归。
