0顶

层展开/关闭运动缓冲效果

稿源：互联网 2022-04-28 00:39:43 点击： 1532 撤稿纠错

在框内点击一下，表框会自动展开，再次点击后会自动关闭。

以下讨论的是和特效相关的层展开/关闭运动缓冲效果教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN"> <head> <title>层展开/关闭 - 运动缓冲效果</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <meta name="keywords" content="小秦,展开,关闭,运动缓冲,效果,javascript,封装" /> <meta name="description" content="展开/关闭 - 运动缓冲效果" /> <meta name="copyright" content="Copyright 2008 XQin.cn" /> <meta name="author" content="小秦" /> <script type="text/javascript"> /* 函数名称: Scroll Scroll(obj, h, s) 参数说明: obj,[object] id值或对象. 必需 h,[height] 展开后的高度. 可选(默认为200px) s,[speed] 展开速度,值越小展开速度越慢. 可选(默认为1.2){建议取值为1.1到2.0之间[例如:1.17]}. 函数返回值: true 展开(对象的高度等于展开后的高度) false 关闭(对象的高度等于原始高度) */ function Scroll(obj, h, s){ if(obj == undefined){return false;} var h = h || 200; var s = s || 1.2; var obj = typeof(obj)=="string"?document.getElementById(obj):obj; var status = obj.getAttribute("status")==null; var oh = parseInt(obj.offsetHeight); obj.style.height = oh; obj.style.display = "block"; obj.style.overflow = "hidden"; if(obj.getAttribute("oldHeight") == null){ obj.setAttribute("oldHeight", oh); }else{ var oldH = Math.ceil(obj.getAttribute("oldHeight")); } var reSet = function(){ if(status){ if(oh < h){ oh = Math.ceil(h-(h-oh)/s); obj.style.height = oh+"px"; }else{ obj.setAttribute("status",false); window.clearInterval(IntervalId); } }else{ obj.style.height = oldH+"px"; obj.removeAttribute("status"); window.clearInterval(IntervalId); } } var IntervalId = window.setInterval(reSet,10); return status; } window.onload= function(){ document.getElementById('detail').onclick = function(){ Scroll('detail', 300, 1.3); } document.getElementById('text').onclick = function(){ Scroll('text'); } } </script> </head> <body> 这是一个段落啦!!哇哈哈哈 点我一下下啦:) <div id="text" style="border:1px solid #0f0">Hello World! 你敢点我不 -_|||</div> <button onclick="Scroll('text', 400, 1.2)">Hello World</button> </body> </html> <a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于层展开/关闭运动缓冲效果的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200810161240.shtml方便下次再访问哦。

·上一篇： 模拟ightbox提示框演示特效
·下一篇： 连续滚动效果

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

层展开/关闭运动缓冲效果

文章分类LIST >>返回首页

最新游戏

最新新闻

层展开/关闭 运动缓冲效果

文章分类LIST >>返回首页

最新游戏

最新新闻

层展开/关闭运动缓冲效果