网络编程
位置:首页>> 网络编程>> JavaScript>> 滑动展开/收缩广告代码实例效果

滑动展开/收缩广告代码实例效果

作者:CnLei  发布时间:2007-10-09 12:44:00 

标签:广告,收缩

功能说明: 滑动展开/收缩广告效果,可指定:广告完全展开时的停留时间,最大高度。

兼容浏览器:

IE5.0+、FF1.06+、Opera8.0+

实例代码:

<!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" lang="gb2312"> 
<head> 
<title> 代码实例:滑动展开/收缩广告 </title> 
<meta http-equiv="content-type" content="text/html; charset=gb2312" /> 
<meta name="author" content="枫岩,CNLei.y.l@gmail.com"> 
<meta name="keywords" content="代码实例:滑动展开/收缩广告" /> 
<script type="text/javascript"> 
var intervalId = null; 
function slideAd(id,nStayTime,sState,nMaxHth,nMinHth){ 
  this.stayTime=nStayTime*1000 || 3000; 
  this.maxHeigth=nMaxHth || 90; 
  this.minHeigth=nMinHth || 1; 
  this.state=sState || "down" ; 
  var obj = document.getElementById(id); 
  if(intervalId != null)window.clearInterval(intervalId); 
  function openBox(){ 
   var h = obj.offsetHeight; 
   obj.style.height = ((this.state == "down") ? (h + 2) : (h - 2))+"px"; 
    if(obj.offsetHeight>this.maxHeigth){ 
    window.clearInterval(intervalId); 
    intervalId=window.setInterval(closeBox,this.stayTime); 
    } 
    if (obj.offsetHeight<this.minHeigth){ 
    window.clearInterval(intervalId); 
    obj.style.display="none"; 
    } 
  } 
  function closeBox(){ 
   slideAd(id,this.stayTime,"up",nMaxHth,nMinHth); 
  } 
  intervalId = window.setInterval(openBox,10); 

</script> 
</head> 
<body style="margin:0;padding:0;font-size:14px;"> 
<div id="MyMoveAd" style="background:#ff0;height:12px;overflow:hidden;"> 
<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’,2); 
--> 
</script> 
</body> 
</html>


 


0
投稿

猜你喜欢

  • 表单验证是WEB开发中经常遇到的问题,我们以前常见的做法是:在客户端对表单域进行内容的检查,看是否是满足一定的要求或满足一定的结构,比如:是
  • 对于更完整的代码可以参考,这个是支持数据库的版本。经过测试Asp+Ajax仿google搜索提示效果 数据库版google搜索提示.rar
  •  代码如下:create proc p_sword_getblcolumn ( @tblN
  • 在小飞的博客上看到他写了一篇关于reset.css的文章,文章中关于css的部分分析的非常不错,但对于文中关于强调把CSS分别配置,对每一个
  • 需要的软件phpStudy 用来导入一个数据库api-server 数据库功能可以开启一个服务器,让开发环境可以使用生产环境的网址请求安装
  • 以下为引用的内容:DROP PROCEDURE test_insert ;DELIMITER ;;CREATE PROCEDURE test
  •  现在正在搞三层开发,用ASP和VB6.0,但是现在苦于没有找到合适的方法来调试自己写的DLL文件,效率相当低。  &n
  • 数据库是数据的集合,与数学的集合论有密不可分的关系。为提高查询速度,我们可以:对数据表添加索引,以加快搜索速度;通过编程技巧最大限度地利用索
  • 看到豆瓣上有网友提了这个问题,看到回答的人不多,忍不住写了下面的内容。工作中最常用到的统计方法有哪些?根据我自己的经验给举些例子。1.通过一
  • 本文主要介绍的是MySQL慢查询分析方法,前一段日子,我曾经设置了一次记录在MySQL数据库中对慢于1秒钟的SQL语句进行查询。想起来有几个
  • 一、备份数据库1、打开SQL企业管理器,在控制台根目录中依次点开Microsoft SQL Server2、SQL Server组-->
  • 使用&ldquo;发送测试电子邮件&rdquo;对话框来测试使用特定配置文件发送邮件的能力。过程发送测试电子邮件1.使用对象
  • 使用MySQL,安全问题不能不注意。以下是MySQL提示的23个注意事项:1.如果客户端和服务器端的连接需要跨越并通过不可信任的网络,那么就
  • 现在的垃圾留言越来越智能,并且从留言内容几乎看不出来是垃圾留言,而大量的垃圾留言会导致文章可读性下降,并可能会被搜索引擎惩罚,经过一段时间的
  • Oracle物理结构故障是指构成数据库的各个物理文件损坏而导致的各种数据库故障。这些故障可能是由于硬件故障造成的,也可能是人为误操作而引起。
  • 模式库 在模式库里,我将列出所有电子商务网站需要的模式.以下将罗列出经典常用的模式案例,我也试图让这些模式看起来更有趣味性与实用性。(Yah
  • 不论是做WEB设计还是做交互模型,最快确立创意与设计效果的最好办法就是用笔在纸上绘制出来。不过从事IT行业的人很少一部分是来自美术学院。当然
  • Microsoft SQL Server 2008将包含用于合并两个行集(rowset)数据的新句法。根据一个源数据表对另一个数据表进行确定
  • 修改my.ini或my.conf,将sql-mode="STRICT_TRANS_TABLES,NO_AUTO_CREATE_US
  • 什么是RSS?RSS是站点用来和其他站点之间共享内容的一种简易方式(也叫聚合内容),通常被用于新闻和其他按顺序排列的网站,例如Blog。一段
手机版 网络编程 asp之家 www.aspxhome.com