JS实现滑动展开与折叠效果

王朝html/css/js·作者佚名  2008-05-30
窄屏简体版  字體: |||超大  

以下是引用片段:

<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>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航