crs1138 crs1138 - 1 month ago 7
Javascript Question

jQuery: Hide element on click anywhere else apart of the element


Possible Duplicate:

How to detect a click outside an element?




I'm trying to achieve that a 'div' hides if user clicks anywhere except on the element. I've got following code doing toggle() if user clicks on a button. I want the button click to stay plus if the 'Details' element is visible, reacts to other parts of the screen.

$('.nav-toggle').click(function(){
//get collapse content selector
var collapse_content_selector = $(this).attr('href');

//make the collapse content to be shown or hide
var toggle_switch = $(this);
$(collapse_content_selector).toggle(function(){
if($(this).css('display')=='none'){
//change the button label to be 'Show'
toggle_switch.html('Show Details');
}else{
//change the button label to be 'Hide'
toggle_switch.html('Hide Details');
}
});
});

Answer

Try this approach

$(function() {
    $(document).on('click', function(e) {
        if (e.target.id === 'div1') {
            alert('Div Clicked !!');
        } else {
            $('#div1').hide();
        }

    })
});‚Äč

Check FIDDLE

I did not understand what you meant by integrating with the other part.. This is the basic idea..

Comments