jQuery手风琴不会陷入困境

Question

Maybe someone having the same problem - Im having a small issue with collapse. I have read this article already along with a couple of others How do I keep jQuery UI Accordion collapsed by default? , but i can't seem to get it to collapse by default - ive managed to do it to stay open, but can't get my head around the collapsible true and active false. I am aiming to have it so when you click the next accordion the previous one automatically shuts.

this is the accordion js fiddle link:

https://jsfiddle.net/limtu/gnhgdxrm/

                $(document).ready(function(){
                $('#original .head').click(function(e){
                    e.preventDefault();
                    $(this).closest('li').find('.content').slideToggle();
                });

                $('#improved .head').click(function(e){
                    e.preventDefault();
                    $(this).closest('li').find('.content').not(':animated').slideToggle();
                });
            });

Any suggestions or links to similar problems would be really kind!

Happy Friday!

Answer 1

jsFiddle

$(document).ready(function(){

    var $contents = $("#improved").find(".content"); // Cache your slideable elements

    $('#improved .head').click(function(e){
        e.preventDefault();
        $contents.stop().slideUp(); // Slide up all
        $(this).closest('li').find('.content').stop().slideToggle(); // Toggle one
    });
});

and fix all those things in HTML and move your inline styles to stylesheet