setTimeout中调用函数有参数该怎么传递

HTML与JavaScript页面效果实现

最新推荐文章于 2023-06-02 10:38:27 发布

转载最新推荐文章于 2023-06-02 10:38:27 发布 · 297 阅读

文章标签：

#fold #function

本文介绍了一个使用HTML和JavaScript创建动态页面效果的例子。通过设置元素的高度并利用JavaScript定时器逐步减少高度值来实现元素折叠效果。此示例有助于理解基本的网页布局及简单的JavaScript操作。

<!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">
<head>
<script type="text/javascript">
<!--
window.onload=function(){
   var obj=document.getElementById("test");
   fold_off(obj);
}
function fold_off(o){
   var h=parseInt(o.style.height);
   h--;
   o.style.height=h+"px";
   var stop=setTimeout(function(){fold_off(o);},10);
   if (h == 0){
       clearTimeout(stop);
   }
}
//-->
</script>
</head>
<body>
   <div id="test" style="height:150px;width:100px;background-color:#DAE3FE;"></div>
</body>
</html>