Проблема переключения Jquery Slickbox

Question

Вот код, который я использую

$(document).ready(function(){
        $('#slickbox').hide();
        // toggles the slickbox on clicking the noted link
        $('a#slick-show').click(function() {
            $('#slickbox').show('slow');
            return false;
        });

        // hides the slickbox on clicking the noted link

        $('a#slick-hide').click(function() {
            $('#slickbox').hide('fast');
            return false;
        });
        // toggles the slickbox on clicking the noted link

        $('a#slick-toggle').click(function() {
            $('#slickbox').toggle(400);
            return false;
        });
    });

Вот код HTML:

<div id="slickbox"> BLARGH</div>
<a href="#" id="slick-show">Show</a>
<a href="#" id="slick-hide">hide</a>
<a href="#" id="slick-toggle">toggle</a>

Показать и Скрыть отлично работают. Blargh скрывается, когда открывается браузер, и я могу показать и скрыть его, но нажимая на ссылки. Моя проблема заключается в том, что, когда я нажимаю на переключатель, если на короткое время открывается, чтобы показать резкость, а затем слайды закрываются. Я могу щелкнуть по нему столько раз, сколько захочу, и он делает то же самое. Как мне заставить его оставаться показанным и затем щелкнуть это снова, чтобы скрыть это?

Answer 1

$('a#slick-toggle').click(function() {
    $('#slickbox').is(":visible") ? $('#slickbox').hide("fast") : $('#slickbox').show("slow");
    return false;
});

или вы можете вызвать щелчки привязок показать / скрыть, и таким образом вам не придется изменять реализацию a#slick-toggle, если вы решите изменить анимацию:

$('a#slick-toggle').click(function() {
    $('#slickbox').is(":visible") ? $('a#slick-hide').trigger("click") : $('a#slick-show').trigger("click");
    return false;
});

Answer 2

$('a#slick-toggle').toggle(function() {
            $('#slickbox').show();
            return false;
        }, function() {
            $('#slickbox').hide();
        });