3

Nella realizzazione di siti internet capita spesso di aprire dei pannelli popup che possano essere chiusi cliccando sulla X, ricliccando sul link che ha innescato l’evento o ancora cliccando fuori dal popup stesso.

Se i primi due casi sono molto semplici da implementare il terzo, invece, potrebbe essere più complicato.

Il concetto è quello di un evento click outside element che può essere innescato, in jQuery, in questo modo:

// Intercetto il click all'interno della pagina
$(document).click( function(e){
    // Se il click è fuori dal popup o dai suoi "figli"
    if ( $(e.target).closest("#popup").length === 0 ) {
        // Nascondo il popup
        $('#popup').hide();
    }
});

Esempio d’uso

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *