cari

Rumah  >  Artikel  >  hujung hadapan web  >  js kod pengiklanan untuk mencapai kemahiran effect_javascript tirai

js kod pengiklanan untuk mencapai kemahiran effect_javascript tirai

WBOY
WBOYasal
2016-05-16 15:40:541615semak imbas

Contoh dalam artikel ini menerangkan kod pengiklanan js untuk mencapai kesan tirai. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Ini adalah kod pengiklanan dengan kesan tirai. Imej pengiklanan itu ditarik perlahan-lahan ke saiz tertentu dan kemudian membeku pada beberapa portal besar .

Tangkapan skrin kesan berjalan adalah seperti berikut:

Alamat demo dalam talian adalah seperti berikut:

http://demo.jb51.net/js/2015/js-lm-style-adv-pic-style-codes/

Kod khusus adalah seperti berikut: 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>slide</title>
<style type="text/css"> 
html,body{
 width:100%;
 height:100%;
 margin:0px;
 border:0px;
 text-align:center;
}
div{
 margin:auto;
 overflow:hidden;
}
</style>
</head>
<body>
<script type="text/javascript"> 
function tag(obj){
 return document.getElementsByTagName(obj)[0];
}
window.onload=function(){
 setTimeout("slideUp();",1000);
}
function slideUp(){
 if(tag("div").offsetHeight>0){
  if(tag("div").offsetHeight>10){
   tag("div").style.height=tag("div").offsetHeight-10+"px"
   setTimeout("slideUp();",20);
  }else{
   tag("div").style.display="none";
   tag("img").src="images/wall8.jpg";
   tag("div").style.display="block";
   slideDown();
  }
 }
}
function slideDown(){
 if(tag("div").offsetHeight<80){
  if(tag("div").offsetHeight<70){
   tag("div").style.height=tag("div").offsetHeight+10+"px";
   setTimeout("slideDown();",20);
  }else{
   tag("div").style.height="80px";
  }
 }
}
</script>
<div><img src="images/wall8.jpg"></div>
</body>
</html>

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

Kenyataan：
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
Artikel sebelumnya：js melaksanakan kemahiran kod_javascript kesan menu (tab) pintu gelangsar mudahArtikel seterusnya：js melaksanakan kemahiran kod_javascript kesan menu (tab) pintu gelangsar mudah

Artikel berkaitan

Lihat lagi