首页 > 代码库 > js笔记---封装一般运动
js笔记---封装一般运动
<!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>无标题文档</title><style> div{ width:100px; height:100px; background-color:red; margin-top:20px;}</style><script type="text/javascript">window.onload=function(){ var oDiv=document.getElementsByTagName(‘div‘); //int i=0; //for(i=0;i<oDiv.length;i++){ //} oDiv[0].onmouseover=function(){ StarMove(this,300,‘width‘); } oDiv[0].onmouseout=function(){ StarMove(this,100,‘width‘); } oDiv[1].onmouseover=function(){ StarMove(this,150,‘height‘); } oDiv[1].onmouseout=function(){ StarMove(this,100,‘height‘); } }
//获取兼容的对应属性值function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; } else{ return getComputedStyle(obj,false)[attr]; } }function StarMove(obj,iTarget,attr){ clearInterval(obj.timer);//清掉对应的 对象的定时器 obj.timer=setInterval(function(){ var iCur=parseInt(getStyle(obj,attr)); var iSpeed=(iTarget-iCur)/8; iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed); if(iCur==iTarget){ clearInterval(obj.timer); } else{ obj.style[attr]=iCur+iSpeed+‘px‘; } },30); }</script></head><body><div></div><div></div><div></div><div></div></body></html>
js笔记---封装一般运动
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。