JQuery UI slideUp и 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/ (нажмите на черную кнопку. Когда вы нажимаете в первый раз, он ничего не делает, но во второй раз контент рухнет.)

Answer 1

Обратный ваши функции

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