震動效果

概念

利用setInterval快速地左右搖晃,達成震動的效果

範例

button#wiggle Shake it
#wiggle
 position: relative
//讓他一開始不要搖
var wiggleTime = 31;
var wiggle=document.querySelector("#wiggle");

window.setInterval(
 function(){
 if(wiggleTime<=31){
 wiggleTime+=1;
 //console.log(wiggleTime);
 
 if(wiggleTime%2==0){
 wiggle.style.left="-5px";
 }else{
 wiggle.style.left="5px";
 } 
 } 
 }
 ,60);

wiggle.addEventListener("click",
 function(){
 wiggleTime=0;
}
);
Display

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *