I've got a div that shows onclick for a link and I want to hide when the mouse is clicked outside the div (similar to most modal box functionality) - the problem is that when the user uses the browser scrollbar, that is considered a click and hides the div
this is what i use to show the div
$('.trigger').click(function(e){
e.preventDefault();
open_slideout(this);
});
function open_slideout(el){
$(document).unbind('mousedown');
//code here to display the div if its not already shown
//close on click-out
$(document).bind('mousedown',function(){
$(panel_id).removeClass('active').hide('fast');
$(el).removeC开发者_如何转开发lass('active');
});
$('.panel.active').bind('mousedown',function(e){e.stopPropagation();});
$('.trigger').bind('mousedown',function(e){e.stopPropagation();});
}
so I've set the stopPropagation if they click within the active area, but like I said, if they use the scrollbar it hides the div
this seems to have done the trick:
$(document.body).bind('mousedown',function(){
$(window).scroll(function(){
scrolling = true;
});
/*other code */
$(document).bind('mousedown',function(){
if(!scrolling){
$(panel_id).removeClass('active').hide('fast');
$(el).removeClass('active');
}
}).bind('mouseup',function(){ scrolling = false; })
/*other code */
精彩评论