熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> Javascript >> 正文

滑動展開/收縮廣告代碼實例效果

2022-06-13   來源: Javascript 
功能說明:
滑動展開/收縮廣告效果可指定廣告完全展開時的停留時間最大高度

兼容浏覽器
IE+FF+Opera+

實例代碼
<!doctype html public //WC//DTD XHTML  Transitional//EN transitionaldtd>
<html xmlns= lang=gb>
<head>
<title> 代碼實例滑動展開/收縮廣告 </title>
<meta httpequiv=contenttype content=text/html; charset=gb />
<meta name=author content=楓巖>
<meta name=keywords content=代碼實例滑動展開/收縮廣告 />
<script type=text/javascript>
var intervalId = null;
function slideAd(idnStayTimesStatenMaxHthnMinHth){
  thisstayTime=nStayTime* || ;
  thismaxHeigth=nMaxHth || ;
  thisminHeigth=nMinHth || ;
  thisstate=sState || down ;
  var obj = documentgetElementById(id);
  if(intervalId != null)windowclearInterval(intervalId);
  function openBox(){
   var h = objoffsetHeight;
   objstyleheight = ((thisstate == down) ? (h + ) : (h  ))+px;
    if(objoffsetHeight>thismaxHeigth){
    windowclearInterval(intervalId);
    intervalId=windowsetInterval(closeBoxthisstayTime);
    }
    if (objoffsetHeight<thisminHeigth){
    windowclearInterval(intervalId);
    objstyledisplay=none;
    }
  }
  function closeBox(){
   slideAd(idthisstayTimeupnMaxHthnMinHth);
  }
  intervalId = windowsetInterval(openBox);
}
</script>
</head>
<body >
<div id=MyMoveAd >
<ul>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
 <li>這裡是廣告內內容</li>
</ul>
</div>
<p>代碼實例<strong>滑動展開/收縮廣告</strong>&nbsp;&nbsp;&nbsp;請刷新頁面再次觀看演示效果</p>
<script type=text/javascript>
 <!
 slideAd(MyMoveAd);
>
</script>
</body>
</html>
From:http://tw.wingwit.com/Article/program/Java/Javascript/201311/25276.html
    推薦文章
    Copyright © 2005-2022 電腦知識網 Computer Knowledge   All rights reserved.