Rumah > hujung hadapan web > tutorial js > Laksanakan kesan gegaran tetingkap berdasarkan kemahiran javascript_javascript

Laksanakan kesan gegaran tetingkap berdasarkan kemahiran javascript_javascript

WBOY
Lepaskan: 2016-05-16 15:22:06
asal
1105 orang telah melayarinya

Contoh dalam artikel ini menerangkan kod terperinci untuk mencapai kesan jitter tetingkap berdasarkan javascript, dan berkongsinya dengan semua orang untuk rujukan anda Kandungan khusus adalah seperti berikut

Rendering:

Klik tetikus dan tetingkap akan bergegar.

Kod khusus:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312"/>
<title>窗口登陆效果</title>
<style type="text/css">
#win
{
 position:relative;
 width:100px;
 height:100px;
 background-color:#666;
}
</style>
<script type="text/javascript"> 
var a=['top','left'];
var b=0; 
var u;
function fudu()
{ 
 win.style[a[b%2]]=(b++)%4<2&#63;"0px":"4px"; 
 if(b>15)
 {
  clearInterval(u);
  b=0
 } 
}
function zd()
{
 clearInterval(u); 
 u=setInterval(fudu,32) 
} 
window.onload=function()
{
 var bt=document.getElementById("bt");
 var win=document.getElementById("win");
 bt.onclick=zd;
}
</script> 
</head> 
<body > 
<button id="bt">点击振动</button> 
<div id="win"></div> 
</body> 
</html>
Salin selepas log masuk

Saya harap artikel ini akan membantu anda mempelajari pengaturcaraan JavaScript dan membantu anda mencapai kesan gegaran tetingkap.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan