關閉股利覆蓋通過點擊在身體的任何

Question

這是我做了什麼：

$('#keks-overlay').hide(); 

$('#click').click(function(){ 
    $('#keks-overlay').toggle(450); 
}); 

$('#close-overlay').click(function(){ 
    $('#keks-overlay').toggle(250); 
}); 

的jsfiddle：http://jsfiddle.net/rHKkD/22/

這工作得很好，但它顯示/隱藏（切換）只點擊「X」（＃close-overlay）。

我想要做一些類似fancybox-effect的效果：點擊全身任何地方都會淡出。

感謝您的幫助。

Answer 1

您可以在處理程序中添加一個事件處理程序包含整個頁面div（或文檔本身），並hide()覆蓋。

$("#somebody").click(function() { 
    $('#keks-overlay').hide(250); 
}); 

但是，如果你想防止覆蓋點擊費用從觸發hide()，你可以一個事件處理程序添加到返回false覆蓋（以防止冒泡的情況下），或者將覆蓋div以外的其他內容（這是因爲覆蓋圖已定位absolute）。

I updated your fiddle to show the second method.

Answer 2

試（當文件準備好）

var inoverlay = false; 
$('#keks-overlay').hover(function() { 
    inoverlay = true; 
}, function() { 
    inoverlay = false; 
}); 

然後獲取所有點擊該文件，檢查inoverlay變量，如果它是假的隱藏你的疊加，否則什麼也不做。如果您有一個首先打開疊加層的按鈕，請務必檢查當您攔截文檔上的點擊時不是那個正在單擊的按鈕。

$(document).click(function(e){ 
    if(inoverlay && (e.target.attr('id') != buttonForOverlay.attr('id'))) { 
     closeOverlay(); 
    } 
});