Auto-close Bootstrap accordion panel when switch to mobile screen size

Question

Using Bootstrap 2.3.2 I have an accordion with a single panel that is open when the page is loaded.

Answer 1

So I eventually figured out how to do this, posting it in case it's of help to anyone.

Alter the HTML to:

    

        

            
                

                    
Refine your search
            
        
    

    

        

            
                

                    
Refine your search (press to reveal)
            
        
    

    


        


            Test text....
        

    

And then use this JS in the file.

$(window).bind('resize load', function() {
    if ($(this).width() < 767) {
        $('#refine-search').removeClass('in');
        $('#refine-search').addClass('out');
    } else {
        $('#refine-search').removeClass('out');
        $('#refine-search').addClass('in');
    }
});