문제

나는 jQuery를 배우고 지금까지 내 코드입니다.

<script type="text/javascript">
$(document).ready(function(){
    $('#login').click(function(){
        $('#login-box').fadeIn('fast');
    });
});
</script>

로그인 버튼을 클릭하면 DIV가 호출됩니다. login-box 페이지에 표시됩니다. 내가하고 싶은 것은 로그인 버튼을 다시 클릭하면 login-box Div는 페이지에서 사라질 것입니다. 이것을하는 가장 좋은 방법은 무엇입니까? 나는 생각하고 있었다 :

$(document).ready(function(){
    $('#login').click(function(){
        if(login-box-is-showing)
        {
            $('#login-box').fadeOut('fast');
        } else {
            $('#login-box').fadeIn('fast');
        }
    });
});

그러나 나는 div가 보여 지는지 여부를 어떻게 결정할 것인지 혼란스러워합니다. 또한 jQuery가 토글 함수를 가지고 있음을 알 수 있습니다. 더 나을까요?

감사.

도움이 되었습니까?

해결책

~에서 칼 스웨덴 버그

jQuery.fn.fadeToggle = function(speed, easing, callback) { 
   return this.animate({opacity: 'toggle'}, speed, easing, callback); 
};

그런 다음이 작업을 수행 할 수 있습니다.

$("#login").click(function () { 
         $("#login-box").fadeToggle() 
 }); 

다른 팁

$("#login-box:visible") 눈에 보이는지 알려줄 것입니다 $("#login-box:hidden") 그렇지 않은지 알려줍니다. 그러나 이것을 처리하는 더 쉬운 방법은 사용하는 것입니다. $.toggle() 또는 $.slideToggle() 약간의 추가 효과를 원한다면.

나는 당신이 사용하고 싶다고 생각합니다 비녀장().

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top