手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >一个封装js代码-----展开收起效果示例
一个封装js代码-----展开收起效果示例
摘要:第一次靠自己完整的封装的小特效,有点小小的兴奋,和大家分享下,希望能对和我一样在探索的童鞋们有点帮助js部分:复制代码代码如下:varsho...

第一次靠自己完整的封装的小特效,有点小小的兴奋,和大家分享下,希望能对和我一样在探索的童鞋们有点帮助

js部分:

复制代码 代码如下:

var show_obj = function(obj,at,ob){

$(obj).bind('click', function(){

var showTxt = $(this).children(at);

//alert($(at).html());

//alert(sObj);

//alert();

//alert($(this).parent().children(p).html());

if(showTxt.html() == '+'){

showTxt.html('-')

}else{

showTxt.html('+')

}

$(this).parent().children(ob).slideToggle(300);

})

}

html 引用:

复制代码 代码如下:

$(function(){

show_obj('.slide_show','.slide_show a','.p-silde');

})

html 代码:

<ul>

<li>

<div><span>我有列表</span><a>+</a></div>

<p>

<a href="#">列表1</a>

<a href="#">列表2</a>

<a href="#">列表3</a>

</p>

</li>

<li>

<div><span>我有列表</span><a>+</a></div>

<p>

<a href="#">列表1</a>

<a href="#">列表2</a>

<a href="#">列表3</a>

</p>

</li>

<li>

<div><span>我没有列表</span></div>

</li>

</ul>

PS:记住引用jQuery的框架,兼容ie6以上,火狐,谷歌,ie6没有测试大家可以自己测试

【一个封装js代码-----展开收起效果示例】相关文章:

你一定会收藏的Nodejs代码片段

7个有用的jQuery代码片段分享

js实现顶部可折叠的菜单工具栏效果实例

简单实用的网页表格特效

js实现仿Windows风格选项卡和按钮效果

一个表格收缩展开的函数

JS实现浏览器菜单命令

一些很实用且必用的小脚本代码第1/5页

一个特帅的展示图片的js+css

在HTML中插入JavaScript代码的示例

精品推荐
分类导航