新买了ipad，在ipad上面看见的一个效果，pc上应该也见过，但是还是ipad上面有印象，如果是弹性运动就最好了

时间：2014-05-30 14:43:16 阅读：237 评论：0 收藏：0 [点我收藏+]

新买了ipad，在ipad上面看见的一个效果，pc上应该也见过，但是还是ipad上面有印象，如果是弹性运动就最好了

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>无标题文档</title>
<style type="text/css">
.in{ width:200px; height:24px; background:#cfcfd1; margin:10px; border:1px solid #999; font-size:13px; padding:2px 10px;}
</style>
<script type="text/javascript">
window.onload=function(){
var aIn=getByClass("in");
for(var i=0;i<aIn.length;i++){
aIn[i].onfocus=function(){
    this.style.background="#fff";
    move(this,"width",parseInt(css(this,"width"))+50);
    }
aIn[i].onblur=function(){
    this.style.background="#cfcfd1";
    move(this,"width",parseInt(css(this,"width"))-50);
    }
}

}
</script>
<link href="css/reset.css" rel="stylesheet" type="text/css">
<link href="css/resouce.css" rel="stylesheet" type="text/css">
</head>
<body>
<input type="text" class="in" />
<input type="text" class="in" />
<input type="text" class="in" />
</body>
</html>
<script type="text/javascript">
function getByClass(oClass,id){
        var re=[];
        var id=id||document;
        if(document.getElementsByClassName){
            re=id.getElementsByClassName(oClass);
        }else{
        
    var aChild=id.getElementsByTagName("*");
    var reg=new RegExp("\\b" + oClass + "\\b");
    for(var i=0;i<aChild.length;i++){
        if(aChild[i].nodeType=="1"){
            var aClassCllect=aChild[i].className;
            if(reg.test(aClassCllect)){
                    re.push(aChild[i]);
                };
        }        
    }    
    }
        return re;
    }
    
    
function move(obj,attr,target){
    clearInterval(obj.timer)
    obj.timer=setInterval(function(){
        if(attr=="opacity"){
            var cur=Math.round(parseFloat(css(obj,attr))*100);            
        }else{
            var cur=parseInt(css(obj,attr));
        }
        
        if(cur<target){
            var speed=Math.ceil((target-cur)/7);
        }else{
            var speed=Math.floor((target-cur)/7);
        }        
        if(attr=="opacity"){
            obj.style.filter=‘alpha(opacity=‘+cur+speed+‘)‘;
            obj.style.opacity=(cur+speed)/100;
        }else{
            obj.style[attr]=cur+speed+"px";
        }
        
        if(cur==target){
            clearInterval(obj.timer)
            
        }                       
    },30)
}
function css(obj,attr){
    return (obj.currentStyle||getComputedStyle(obj,null))[attr];
}
</script>

新买了ipad，在ipad上面看见的一个效果，pc上应该也见过，但是还是ipad上面有印象，如果是弹性运动就最好了,布布扣,bubuko.com

标签：c style class blog code java

原文地址：http://www.cnblogs.com/busicu/p/3760432.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行