最后的回調(diào)不了？
<!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=utf-8" />
<title>無標(biāo)題文檔</title>
<style type="text/css">
*{ margin:0; padding:0}
ul,li{ list-style:none}
ul li{
??
? background:#FF0;
? width:200px;
? height:75px;
? border:4px solid #F0F;
? margin-bottom:10px;
? filter:alpha(opacity:30);
? opacity:0.3;
? }
?
</style>
</head>
<script>
window.onload=function(){
? ? ? ? ? ?var oli=document.getElementById('a');
??
??
? ? ? ? ? ?oli.onmouseover=function(){
startMove(this,'height',150,function(){
startMove(oli,'width',300,function(){
startMove(oli,'opacity',100);
});
});
}
? oli.onmouseout=function(){
? startMove(oli,'opacity',30,function(){
? ?startMove(oli,'width',200,function(){
startMOve(oli,'height',75);
? ?});
? ? ? ?});
}
//var alpha=30;
}
// 獲取任意屬性至，針對IE與火狐做不同的處理 currentStyle是IE方法 Computed Style是火狐的方法
function getStyle(obj,attr){
? ? ? ?if(obj.currentStyle){
? ? ? return obj.currentStyle[attr];
? ? ? ? ?}
? ? ? else{
? ? ? return getComputedStyle(obj,false)[attr];
? ? ? ? ?}
? ? }
function startMove(obj,attr,iTarget,fn){//iTarget目標(biāo)值
? ?var timer=null;
? ?clearInterval(obj.timer);
obj.timer=setInterval(function(){
var sty=0;
? ? ? ?if(attr=='opacity'){
?sty=Math.round(parseFloat(getStyle(obj,attr))*100);
? }else{
?sty=parseInt(getStyle(obj,attr));
? }
//算速度 ??
? ?var speed=(iTarget-sty)/10;
? speed=speed>0?Math.ceil(speed):Math.floor(speed);
??
?
//檢測停止
if(sty==iTarget){
? ? ? clearInterval(obj.timer);
? ? ? if(fn){
? ? ? ?fn();
? ? ? ?}
? ? ? }else{
if(attr=='opacity'){
obj.style.filter='alpha(opacity:'+(sty+speed)+')';
obj.style.opacity=(sty+speed)/100;
}else
? ? ? obj.style[attr]=sty+speed+'px';
? }
},30)
}
</script>
<body>
? ?<ul>
? ? ?<li id="a"></li>
? ? ?
? ? ?
? ? </ul>
</body>
</html>
2016-03-27
坑爹啊 startMove ?的O被大些了 ?