一個Banner廣告收縮效果

2024-09-05 12:22:42

字體：大中小

來源：轉載

供稿：網友

一個Banner廣告收縮效果，點開后，網頁顯示大廣告，用鼠標點擊“關閉”后，廣告會收縮上去，此效果已在各大網站見到過，歡迎借鑒試用。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>一個Banner廣告收縮效果</title><style type="text/css">*{margin:0; padding:0;}/*為了方便 直接這樣重置了*/#main{margin:0 auto; width:960px;}#banner{display:none; margin:0 auto; width:960px; height:160px; background:url(http://www.codefans.net/jscss/demoimg/201107/banner.png) no-repeat; position:relative;}#close{display:block; width:50px; height:22px; text-align:center; line-height:22px; border:1px #ddd solid; background:#000; color:#fff; font-size:12px; float:right; cursor:pointer;}</style><script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery1.3.2.js"></script><script type="text/javascript">$(function(){$("#banner").slideDown();var Up=function(){$("#banner").slideUp(1500)}setTimeout(Up,3000);$("#close").click(function(){$("#banner").slideToggle(600,function(){if($("#banner").css("display") == "none"){$("#close").text("打開");}else{$("#close").text("關閉");}});});});</script></head><body><div   class="iwvjtn8m0"   id="main"><div   class="iwvjtn8m0"   id="banner"></div><span id="close">關閉</SPAN>
</div>
</div>
<div   id="iwvjtn8m0"   class=page1>
<p align="center" class="pageLink"></p>
</div>

<div   id="iwvjtn8m0"   class="fenxiang">

<div style="text-align:left">上一篇：<a href='/wen/2024/09-05/1558318.html'>浮動在網頁右下角的彩票開獎公告窗口</a></div>
<br>
<div style="text-align:left">下一篇：<a href='/wen/2024/09-05/1558320.html'>拉幕的廣告代碼</a></div>
<br>
<script src=/d/js/acmsd/gao21.js></script>

</div>

<div   id="iwvjtn8m0"   class="pinglun">

<script>
		  function CheckPl(obj)
		  {
		  if(obj.saytext.value=="")
		  {
		  alert("您沒什么話要說嗎？");
		  obj.saytext.focus();
		  return false;
		  }
		  return true;
		  }
		  </script><form action="/e/pl/doaction.php" method="post" name="saypl" id="saypl" onsubmit="return CheckPl(document.saypl)">
<table width="100%" border="0" cellpadding="0" cellspacing="0" id="plpost">

學習交流