Jquery UI slideUp and slideDown

Question

ボタンをクリックしていくつかのボックスを表示したり非表示にするのは忙しいです。それはうまくいっていますが、初めてボックスを隠したいときは2回クリックする必要がありますか？

これは私のJSコードです：

$(function() { 
    $('.title .hide').showContent(); 
}); 

$.fn.showContent = function() { 
    return this.each(function() { 
     var box = $(this); 
     var content = $(this).parent().next('.content'); 

     box.toggle(function() { 
      content.slideDown(400); 
     }, function() { 
      content.slideUp(400); 
     }); 

    }); 
}; 

そしてデHTML

<div class="box"> 
    <div class="title"> 
     Title 
     <span class="hide"></span> 
    </div> 
    <div class="content">Content</div> 
</div> 

これはなぜでしょうか？誰かが私を助けることができますか？ http://jsfiddle.net/wq7PF/（。。あなたはそれが何もしていない最初の時間をクリックすると黒いボタンをクリックしますが、2番目の時間、コンテンツが崩壊する）

Answer 1

あなたの機能をリバース

：ここ

そしてデモがあります

box.toggle(function() { 
    content.slideUp(400); 
}, function() { 
    content.slideDown(400); 
});