抖動效果—創意版


閑得無聊,弄了個抖動效果,大家看看有沒有值得學習地方
 
 
 
 
 

 

<html><head><title>鼠標移至圖片后抖動的JS代碼 </title></head><BODY>
<style>.shakeimage{position:relative; left:100px; top:100px;}</style>


<img src=http://img.baidu.com/hi/logo/logo_93_30.gif class="shakeimage" onMouseover="shake(this,'onmouseout')" >

<script language="JavaScript1.2">

var typ=["marginTop","marginLeft"],rangeN=10,timeout=20;

function shake(o,end){
	var range=Math.floor(Math.random()*rangeN);
	var typN=Math.floor(Math.random()*typ.length);
o["style"][typ[typN]]=""+range+"px";
var shakeTimer=setTimeout(function(){shake(o,end)},timeout);
o[end]=function(){clearTimeout(shakeTimer)};
}

</script>

</body></html>

 

創意之處:

  1. 調用簡單:事件="shake(this,'onmouseout')";
  2. 代碼簡短:函數主體程序僅僅5行代碼
  3. 性能高
  4. 邏輯清晰,便於二次開發


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM