Jquery Accordion सभी को संकुचित करें सभी

Question

मैं "सभी का विस्तार करें" और "सभी को ध्वस्त" करने का एक तरीका ढूंढ रहा था। मैंने एक सरल jquery accordion का उपयोग कर नए कोड के साथ डेमो अद्यतन किया है।

मूल कोड में रयान Stemkoski में क्रेडिट हो जाएगा http://www.stemkoski.com/stupid-simple-jquery-accordion-menu/

डेमो: http://jsbin.com/ucalu3/5/

$(document).ready(function() { 
    $('.question').click(function() { 

    if($(this).next().is(':hidden') != true) { 
       $(this).removeClass('active'); 
    $(this).next().slideUp("normal"); 
    } else { 
    $('.question').removeClass('active'); 
    $('.answer').slideUp('normal'); 
    if($(this).next().is(':hidden') == true) { 
    $(this).addClass('active'); 
    $(this).next().slideDown('normal'); 
    } 
    } 
    }); 

    $('.answer').hide(); 

    $('.expand').click(function(event) 
    {$('.question').next().slideDown('normal'); 
     {$('.question').addClass('active');} 
    } 
); 

    $('.collapse').click(function(event) 
    {$('.question').next().slideUp('normal'); 
     {$('.question').removeClass('active');} 
    } 
); 
}); 

Answer 1

मैं कक्षा या विस्तार करने और पतन लिंक करने के लिए आईडी तो कुछ इस तरह जोड़ना होगा काम करेगा

$(document).ready(function() { 
    $("#expand").click(function(){ 
    ('.answer').slideDown('normal'); 
    }); 

    $("#collapse").click(function(){ 
    ('.answer').slideUp('normal'); 
    }); 
} 

Answer 2

इसे हल किया जा सकता है।

बस एग्रीजन तत्व ('.ui-widget-content') पर jQuery छुपा/शो कमांड का उपयोग करें जिसे आप विस्तृत/संक्षिप्त करना चाहते हैं।

उदाहरण:

$(document).ready(function() { 
     $('.expand').click(function() { 
      $('.ui-widget-content').show(); 
     }); 
     $('.collapse').click(function() { 
      $('.ui-widget-content').hide(); 
     }); 
}); 

बेला देखें: http://jsfiddle.net/ekelly/hG9b5/11/