列表代码我的第一个封装js代码-----展开收起效果

上班之余抽点时间出来写写博文，希望对新接触的朋友有帮助。今天在这里和大家一起学习一下列表代码

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

    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 class="clearfix slide_show"><span style="float:left">我有列表</span><a style="float:right">+</a></div>

                <p class="p-silde"  style="display:none">

                

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

                    

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

                    

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

                </p>

    

    </li>

    <li>

    <div class="clearfix slide_show"><span style="float:left">我有列表</span><a style="float:right">+</a></div>

                <p class="p-silde"  style="display:none">

                

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

                    

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

                    

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

                </p>

    

    </li>

    <li>

    <div class="clearfix slide_show"><span>我没有列表</span></div>

    </li>

    </ul>

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

文章结束给大家分享下程序员的一些笑话语录： PC软件体积大，是因为一个PC软件功能往往较多，能够满足你一个方面的需求，而一个iphone软件往往没几行代码，干一件很小的事情，自然需要的软件就多。就像吃西瓜和吃瓜子的来比数目，单位不同啊。

--------------------------------- 原创文章 By
列表和代码
---------------------------------