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는 브라우저가 열리면 숨겨져 있으며 보여주고 숨길 수 있지만 링크를 클릭합니다. 내 문제는 토글을 클릭하면 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();
        });