mouseover и mouseout в аккордеоне

Question

Я использую аккордеон для навигации, и я использую jquery. Моя проблема заключается в том, что при загрузке страницы все заголовки должны быть закрыты по умолчанию, когда я навешиваю любой заголовок, который его братья и сестры откроют, когда я его автоматически закрою.

<ul id="accordion"> 
    <li> 
     <a href="#" class="history_heading" rel="history_heading">HISTORY</a> 
     <ul> 
      <li><a href="#">Link One</a></li> 
      <li><a href="#">Link Two</a></li> 
      <li><a href="#">Link Three</a></li> 
      <li><a href="#">Link Four</a></li> 
      <li><a href="#">Link Five</a></li> 
     </ul> 
    </li> 

    <li> 
     <a href="#" class="geography_heading" rel="geography_heading">GEOGRAPHY</a> 
     <ul> 
      <li><a href="#">Link One</a></li> 
      <li><a href="#">Link Two</a></li> 
      <li><a href="#">Link Three</a></li> 
      <li><a href="#">Link Four</a></li> 
      <li><a href="#">Link Five</a></li> 
     </ul> 
    </li> 
</ul> 

Пожалуйста, помогите мне
JQuery код, который приведен ниже для функции мыши, но я хочу, в соответствии с моими требованиями
Jquery код

$(document).ready(function() { 

    $('#accordion li').children('ul').hide(); 
    $('.history_heading').parent().addClass('active').find('ul').show(); 

    $('#accordion a').click(function() { 

     $(this).parent().siblings('.active').removeClass('active').find('ul').slideUp('fast'); 

     if ($(this).parent().hasClass('active')) { 
      $(this).next('ul').slideUp('fast'); 
      $(this).parent().removeClass('active'); 
     } else { 
      $(this).next('ul').slideDown('fast'); 
      $(this).parent().addClass('active'); 
     } 

    }); 




}); 

Answer 1

Простой

jQuery(function ($) { 
    $('#accordion li').hover(function() { 
     $(this).find('ul').stop(true, true).slideDown() 
    }, function() { 
     $(this).find('ul').stop(true, true).slideUp() 
    }).find('ul').hide() 

}) 

Demo: Fiddle

Или

jQuery(function ($) { 
    $('#accordion li').hover(function() { 
     $(this).find('ul').stop(true, true).slideToggle() 
    }).find('ul').hide() 
}) 

Answer 2

$('#accordion > li').each(function(){ 
    var accHolder = $(this), 
     acc = accHolder.find('> ul'); 

    accHolder.hover(function(){ 
     acc.slideDown(); 
    }, function(){ 
     acc.slideUp(); 
    }); 
}); 

Answer 3

Привет отправил скрипку для и надеемся, что это помогает ... http://jsbin.com/aKIpEZu/2/edit