linux社区爱心援助Linux认证系列教程业界动态站务新闻公司招聘网络学院网址大全LPI专题CISCO专题
设为首页
加入收藏
管理团队
JSP  
JAVA  
PERL  
 您的位置:首页 > 开发语言 > JavaScript >
栏目导栏
  php
  JSP
  ASP
  asp.net
  JAVA
  c/c++/c#
  perl
  JavaScript
  Basic
  Delphi
资料搜索
热门文章
·javascript 时间对象的格式化
·去掉字符串前后的空格
·javascript 事件监听机制
·javascript 事件调用顺序
·js刷新框架子页面的七种方法
·JavaScript:替换字符串
·IE下的JScript编程需注意的内存
·用javascript操作word文档
·Javascript中CTRL+回车提交表单
·JS 获取鼠标位置
·javascript判断Email地址是否有
·Javascript中Select的OnChange
·JS实现的滑动展开与折叠效果
·有分页功能的WEB打印
·Javascript实现窗口最大化的严
最新文章
·使用CSS改变表格边框样式
·为网页添加浮动广告
·判断表单中添加是否数字的JS与
·让浏览器状态栏动起来
·使用Javascript制作行间颜色间
·禁止用右键查看源代码
·网页侦测四法
·制作弹出公告窗口
·为网页添加特效
·网页中取消鼠标右键方法大全
·JavaScript 根据屏幕解析度显示
·如何实现浏览器上的右键菜单
·如何制作浮动广告
·让弹出窗口变得“体贴”一些
·JavaScript技巧:让网页自动穿上
Google
 
滑动展开/收缩广告代码实例效果
[ 作者:  加入时间:2007-11-13 13:35:26  来自:Linux联盟收集整理 ]
功能说明:kciLinux联盟
滑动展开/收缩广告效果,可指定:广告完全展开时的停留时间,最大高度kciLinux联盟
kciLinux联盟
兼容浏览器:kciLinux联盟
IE5.0+、FF1.06+、Opera8.0+kciLinux联盟
kciLinux联盟
实例代码:
<!doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" kciLinux联盟
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> kciLinux联盟
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312"> kciLinux联盟
<head> kciLinux联盟
<title> 代码实例:滑动展开/收缩广告 </title> kciLinux联盟
<meta http-equiv="content-type" content="text/html; charset=gb2312" /> kciLinux联盟
<meta name="author" content="枫岩,CNLei.y.l@gmail.com"> kciLinux联盟
<meta name="keywords" content="代码实例:滑动展开/收缩广告" /> kciLinux联盟
<script type="text/javascript"> kciLinux联盟
var intervalId = null; kciLinux联盟
function slideAd(id,nStayTime,sState,nMaxHth,nMinHth){ kciLinux联盟
  this.stayTime=nStayTime*1000 || 3000; kciLinux联盟
  this.maxHeigth=nMaxHth || 90; kciLinux联盟
  this.minHeigth=nMinHth || 1; kciLinux联盟
  this.state=sState || "down" ; kciLinux联盟
  var obj = document.getElementById(id); kciLinux联盟
  if(intervalId != null)window.clearInterval(intervalId); kciLinux联盟
  function openBox(){ kciLinux联盟
   var h = obj.offsetHeight; kciLinux联盟
   obj.style.height = ((this.state == "down") ? (h + 2) : (h - 2))+"px"; kciLinux联盟
    if(obj.offsetHeight>this.maxHeigth){ kciLinux联盟
    window.clearInterval(intervalId); kciLinux联盟
    intervalId=window.setInterval(closeBox,this.stayTime); kciLinux联盟
    } kciLinux联盟
    if (obj.offsetHeight<this.minHeigth){ kciLinux联盟
    window.clearInterval(intervalId); kciLinux联盟
    obj.style.display="none"; kciLinux联盟
    } kciLinux联盟
  } kciLinux联盟
  function closeBox(){ kciLinux联盟
   slideAd(id,this.stayTime,"up",nMaxHth,nMinHth); kciLinux联盟
  } kciLinux联盟
  intervalId = window.setInterval(openBox,10); kciLinux联盟
} kciLinux联盟
</script> kciLinux联盟
</head> kciLinux联盟
<body style="margin:0;padding:0;font-size:14px;"> kciLinux联盟
<div id="MyMoveAd" style="background:#ff0;height:kciLinux联盟
12px;overflow:hidden;"> kciLinux联盟
<ul> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
 <li>这里是广告内内容</li> kciLinux联盟
</ul> kciLinux联盟
</div> kciLinux联盟
<p>代码实例:<strong>滑动展开/收缩广告</strong>&nbsp;&nbsp;&nbsp;请刷新页面,再次观看演示效果</p> kciLinux联盟
<script type="text/javascript"> kciLinux联盟
 <!-- kciLinux联盟
 slideAd('MyMoveAd',2); kciLinux联盟
--> kciLinux联盟
</script> kciLinux联盟
</body> kciLinux联盟
</html>
Linux联盟收集整理 ,转贴请标明原始链接,如有任何疑问欢迎来本站Linux论坛讨论
评论】【加入收藏夹】【 】【打印】【关闭
※ 相关链接
 ·滑动展开/收缩广告代码实例效果  (2007-11-13 13:25:12)
 ·网页最简短的拖动对象代码实例演示  (2007-11-13 13:23:35)
 ·通过实例看VCL组件开发全过程  (2007-11-09 11:22:32)
 ·限制路由器虚拟终端的连接访问实例解析  (2007-11-06 17:09:55)
 ·实例剖析:网络环路故障  (2007-11-05 17:10:31)
 ·使用类方法控制实例的唯一性  (2007-11-02 13:04:25)
 ·实例讲解BGP配置五大注意事项  (2007-11-02 11:30:58)
 ·Javascript+XML实现分页的实例  (2007-10-29 13:56:19)
 ·详细解析网页漂浮广告代码的含义  (2007-10-29 13:49:01)
 ·网页中任意漂浮的广告代码  (2007-10-29 13:27:23)