<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>任意属性值2</title>
<style>
*{margin: 0;padding: 0;}
ul,li{
list-style: none;
}
ul li{
width: 200px;
height:100px;
background: yellow;
margin-bottom: 20px;
border:4px solid #000;
opacity: 0.3;
filter: alpha(opacity:30);
}
</style>
<script>
window.onload=function () {
var lia = document.getElementById('li1');
lia.onmouseover=function () {
startMove(this,'opacity',100);
}
lia.onmouseout=function () {
startMove(this,'opacity',30);
}
}
function getStyle (obj,attr) {
if (obj.currentStyle) {
return obj.currentStyle[attr];
} else {
return getComputedStyle(obj,false)[attr];
}
}
var alpha=30;
function startMove(obj,attr,itarget) {
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var icur = 0;
if (attr == 'opacity') {
icur = parseFloat(getStyle(obj,attr))*100;
} else {
icur = parseInt(getStyle(obj,attr));
}
var speed = (itarget-icur)/8;
speed = speed>0?Math.ceil(speed):Math.floor(speed);
if (icur==itarget) {
clearInterval(obj.timer)
} else {
if (attr=='opacicy') {
// obj.style.filter='alpha(opacity:'+(icur+speed)+')';
obj.style.opacity=(icur+speed)/100;
} else {
obj.style[attr]=icur+speed+"px";
}
}
}, 30)
}
</script>
</head>
<body>
<ul>
<li id ='li1'></li>
</ul>
</body>
</html>这段代码怎么对透明度不起作用呢？求大神指导~谢谢~
添加回答
举报
0/150
提交
取消