當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript提示抖动实现方法
生活随笔
收集整理的這篇文章主要介紹了
javascript提示抖动实现方法
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
css代碼:
<style type="text/css">#div1{ width:200px; height:200px; background-color:orange; border:solid 5px #f0f0f0; position:absolute; left:600px; top:200px;} </style>?js代碼:
<script type="text/javascript">window.οnlοad=function(){ var oDiv=document.getElementById('div1'); oDiv.οnclick=function(){shake(oDiv,'left');}}//封裝抖動方法function shake(obj,attr){ var arr=[];var timer=null;var num=0; var pos=parseInt(getStyle(obj,attr)); //通過數組實現抖動的頻率for(var i=20;i>0;i-=2){arr.push(i,-i);}arr.push(0);//設置定時器實現抖動clearInterval(timer);timer=setInterval(function(){obj.style[attr]=pos+arr[num]+'px';num++;if(num==arr.length){clearInterval(timer);}},20)}//獲取元素屬性方法function getStyle(obj,attr){return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj,null)[attr];} </script>? HTML:
<body><div id="div1"></div> </body>?
轉載于:https://www.cnblogs.com/lvmylife/p/4565238.html
總結
以上是生活随笔為你收集整理的javascript提示抖动实现方法的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 落日高原位于哪个地图中
- 下一篇: QQ空间app怎么选择查看消息时间(QQ