jQuery를 패널을 전환은이 사이트에서 일하고 있어요

Question

패널이 표시되는 경우에만, 외부 요소의 클릭에 폐쇄 현재 왼쪽에있는 "연락처"버튼을 클릭하면 현재 열려 있고 사용자는 패널 외부를 클릭하거나 "#content"영역에서 esc 키를 친다.

#content 영역에서 클릭이 트리거보다 쉬울 것이라고 생각 했으므로 시작했습니다.

$("#panel").is(":visible") { 
    $("#content").click(function(){ 
    $("#panel").slideToggle("3000"); 
    }); 
}; 

이것은 접촉 버튼의 기능을 파괴하고 : 나는 요소를 볼 수있는 경우에만 기능을 트리거에 몇 스레드를 읽었습니다,하지만 내가 지금까지 가지고 올 한 것은 전혀 작동하지 않습니다 나는 이것의 몇몇 변이를 소용 없게 시도했다. 내가 여기서 눈부신 실수를하고 있는가? 모든 조언을 크게 주시면 감사하겠습니다.

감사합니다.

Answer 1

바인딩 Click 및 문서에 Keydown 기능과 패널 또는 플립 버튼을 클릭 할 때 click 함수는 문서까지 거품을하지 않습니다 있는지 확인하십시오. 좋아요 :

$(document).bind({ 
    keydown:function(e) { 
     if (e.keyCode == 27) { 
      $("#panel").slideUp("3000"); 
     } 
    }, click: function(e) { 
     $("#panel").slideUp("3000"); 
    } 
}); 
$('#flip, #panel').bind('click', function(e){return false}); 

Answer 2

패널을 열 때 페이지 본문에 클래스를 추가하고 닫을 때 제거하지 않는 이유는 무엇입니까? 즉 만드는이 훨씬 더 간단 : 몸 '클래스'는 #content div에 자동으로 가까운 접촉에있는 모든 클릭의 클래스가

이제

$('.class #content').click(function(){ 
// Close the contact panel 
}); 

.

의미가 있습니까? 그런데 멋진 사이트를 찾고 있습니다.

Answer 3

$('#flip').bind('click', function(){ 
    $(this).toggleClass('contactOpen'); 
    $("#panel").slideToggle("3000"); 
}); 

$('#content').bind('click', function(){ 
    if($('#flip').hasClass('contactOpen')){ 
     $(this).toggleClass('contactOpen'); 
     $("#panel").slideToggle("3000"); 
    } 
});