js滑动展开与折叠效果(收缩)
作者:CNLei 来源:cnlei.blog 时间:2007-10-09 13:17:00
需要写个js滑动展开折叠(收缩)的效果,搜索到无忧脚本的一篇贴子,稍加修改了下使其在FF也可应用,代码如下:
<script type="text/javascript">
//Url: http://bbs.51js.com/thread-61646-1-1.html
//Author: 风云突变
//Modify: 枫岩
var act;
function over(s,nMax){
var obj=document.getElementById(s);
var h = parseInt(obj.offsetHeight);
if (h < nMax){
obj.style.height = (h + 2)+"px";
clearTimeout(act);
act = setTimeout("over('"+s+"',"+nMax+")", 10);
}
}
function out(s,nMin){
var obj=document.getElementById(s);
var h = parseInt(obj.offsetHeight);
if (h > nMin){
obj.style.height = (h - 2)+"px";
clearTimeout(act);
act = setTimeout("out('"+s+"',"+nMin+")", 10);
}
}
</script>
<div id="mytd" onmouseover="over('mytd',200);" onmouseout="out('mytd',30);" style="background:#eee;">代码实例:层的滑动展开/折叠</div>
查看滑动展开与折叠效果:
无忧网友 fangxiao9159 再次优化后:
<script type="text/javascript">
var intervalId = null;
function move(id,state){
var obj = document.getElementById(id);
if(intervalId != null)
window.clearInterval(intervalId);
function change(){
var h = parseInt(obj.offsetHeight);
obj.style.height = (state == "down") ? (h + 2) : (h - 2);
}
intervalId = window.setInterval(change,10);
}
</script>
<table border="1" cellpadding="0" cellspacing="0" id="mytd" onmouseover="move('mytd','down');" onmouseout="move('mytd','out');">
<tr><td>无忧脚本 - 风云突变</td></tr></table>
相关阅读:
标签:滑动,折叠,收缩,js
0
投稿
猜你喜欢
MySQL Basis 常用命令
2010-11-11 11:59:00
一个输入框提示列表效果
2008-03-09 18:53:00
您是否记得关闭所有的XHTML元素
2009-07-13 12:17:00
触手生春【4.13】CSS中的伪元素选择符
2008-11-11 13:10:00
在asp中通过vbs类实现rsa加密与解密
2010-05-27 12:18:00
Response.Flush的使用心得
2010-04-08 12:57:00
ASP四级连动下拉列表程序段
2009-07-03 15:33:00
SQL SERVER 建立索引
2010-07-02 21:01:00
Javascript语法检查插件 jsLint for Vim
2009-03-11 16:37:00
谈谈我的“分离”观
2010-08-31 14:47:00
ORACLE数据库事务隔离级别介绍
2012-10-07 10:43:36
德国ebay购头记
2009-04-29 11:10:00
msxml3.dll 错误 ‘800c0005’解决方案
2009-10-05 18:36:00
互联网产品设计零碎记
2010-09-25 12:49:00
js中的文档模式-document.compatMode
2009-08-14 20:30:00
favicon.ico以及动态图片的实现
2008-07-03 12:34:00
IE6,7下实现white-space:pre-wrap;
2009-12-31 18:30:00
简洁的是最好的吗?
2010-06-24 21:46:00
seo网站如何实现301跳转?
2010-01-15 12:59:00
IE6浮出层穿透解决方案中的iframe高度自适应
2009-10-30 18:08:00