自己实现一个简单的JQuery下的accordion

1.添加javascript代码:
//Design By Eric Xu 2008-5-28
function accordion(cz){
    this.prototype=create();
    function create(){
        $('dl.'+cz+' > dd').hide();
        $('dl.'+cz+' > dt').click(function(){
            var content = $(this).next();
            var others = content.parent().find("dd:visible");
            if (others.length&&others.html()!=content.html()){
                others.slideUp('fast', function() {
                    content.slideToggle('fast');
                });
            }else{content.slideToggle('fast');}
        });
    }
}


2.编写html代码:
<dl class="gaga">

    <dt>haha</dt>
    <dd>i am haha<br/><br/><br/><br/></dd>

    <dt>haha2</dt>
    <dd>i am haha2<br/><br/><br/><br/></dd>

</dl>


3.添加javascript代码
new accordion("gaga");


4.搞定啦。

感觉挺好使 大家快试试。

你可能感兴趣的:(JavaScript,html,jquery,prototype)