[效果]JS折叠菜单-使用方法 (Moo.Fx)
（从已经死了一次又一次终于挂掉的百度空间人工抢救出来的，发表日期2014-06-24）
用法:
1.添加JS库
CODE:
<script src="prototype.lite.js" type="text/javascript"></script>
<script src="moo.fx.js" type="text/javascript"></script>
<script src="moo.fx.pack.js" type="text/javascript"></script>
2.建立xhtml结构:
CODE:
<div id="container">
<H1 class="title"><A href="javascript:void(0)">(1)这里放标题</H1>
<div class="content">
<p>(1)这里放内容</p>
</div>
<H1 class="title"><A href="javascript:void(0)">(2)这里放标题</H1>
<div class="content">
<p>(2)这里放内容</p>
</div><H1 class="title"><A href="javascript:void(0)">(3)这里放标题</H1>
<div class="content">
<p>(3)这里放内容</p>
</div>
</div>
3.调用JS:
CODE:
<script type="text/javascript">
//定义contents 组数为所有将要显示的内容
var contents = document.getElementsByClassName('content');
//定义contents 组数为所有标题，也是可点击展开的按钮
var toggles = document.getElementsByClassName('title');
//调用moofx JS库
var myAccordion = new fx.Accordion(
toggles, contents, {opacity: true, duration: 400} //opacity确定是否有alpha透明变化,duration确定动作所有时间
);
myAccordion.showThisHideOpen(contents[0]); //默认打开第一个内容
</script>
最近用到了这个，记录一下。
最新文章
- ExtJs 学习之开篇（二） Observable 给类添加监听
- MMORPG大型游戏设计与开发（客户端架构 part8 of vegine）
- 【源码笔记】BlogEngine.Net 中的权限管理
- Region的预分区
- hp惠普服务器监控硬盘
- （转 飛雲若雪）ADO.NET
- PictureBox从本地上传图片和保存在磁盘目录
- C++学习笔录3
- AngularJS模块的详解
- ReactNative学习之Html基础
- Java GUI+mysql+分页查询
- NET Core 跨平台执行命令、脚本
- 记录以下docker的基本命令
- ubuntu16.04安装mrpt
- 小程序中通过判断id来删除数据，当数据长度为0时，显示隐藏部分（交流QQ群：604788754）
- EF学习笔记（十） 处理并发
- [PHP] php + phpstudy + phpstrom + xdebug + postman开启调试
- webpack打包经验——处理打包文件体积过大的问题
- gitlab hooks配置
- [js]promise学习2