$(document).click() alternative.
Posted: Wed Feb 02, 2011 4:02 pm
I have a side panel that slides out when you click on the handle and back in when you click it again. I need a way to make it slide back in if any thing else is clicked.
$(document).click() works, but I don't want to bind .click() to the whole document. I've also tried $('div').not('. sliding-div').click() but that binds a click function to every single other element in the document, causeing massive delays in the sliding function executing.
Is there any other way to get the panel to close when something other than itself is clicked or am I stuck using $(document).click()?
Here is the actual sliding div function.
$(document).click() works, but I don't want to bind .click() to the whole document. I've also tried $('div').not('. sliding-div').click() but that binds a click function to every single other element in the document, causeing massive delays in the sliding function executing.
Is there any other way to get the panel to close when something other than itself is clicked or am I stuck using $(document).click()?
Here is the actual sliding div function.
Code: Select all
// Side bar
$('.slide-out-div').css({
'left': '-392px',
'top': '100px',
'position': 'absolute'
}).find('.handle').css ({
'background' : 'url(\'../styles/images/contact_tab.gif\') no-repeat',
'width' : '40px',
'height': '122px',
'display': 'block',
'textIndent' : '-99999px',
'outline' : 'none',
'position' : 'absolute',
'left' : '390px',
'top' : '-1px'
});
$('.handle').click(function() {
var $lefty = $('.slide-out-div');
$lefty.animate({
left: parseInt($lefty.css('left'),10) == 0 ? -$lefty.outerWidth() : 0
});
});