clickoutside ne fonctionne pas

Bonjour

J ai un menu ma page construit comme cela :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

<div id="sticky"> <div class="container" > <div class="menu" id="div_menu"> <div id="div-1a"> <ul> <li><a href="#" >menu1</a></li> <li><a href="#">menu2</a></li> <li><a href="#">menu3</a></li> <li><a href="#">menu4</a></li> <ul> </div> </div> </div> </div> </div>

---

il s affiche au click sur un lien sans pb.
Je voudrais pouvoir le fermer quand on clique n'importe où ailleurs dans la page mais je n y parviens pas.
J ai essayé avec ce qui me semblais le plus logique :

Code:

---

1 2 3

$("#div_menu").bind( "clickoutside", function(event){ $(this).hide(); });

---

Pourriez vous m'indiquer si je fais fausse route et comment y remedier ?
Merci dde votre aide.

Sans doute parce que "clickoutside" n'est pas un évènement ...


le plus simple est de mettre l'evènement hide sur le click du html (partout)

Code:

---

1 2 3 4

$('html').on('click',function() { $("#div_menu").hide(); });

---

et de bloquer la propagation du click du menu pour ne pas déclencher le hide (sauf sur le menu)

Code:

---

1 2 3

$('#div_menu').on('click',function(e){ e.stopPropagation(); });

---

merci, cela fonctionne parfaitement :P

un exemple avec redéclenchement du masquage du sous menu par blocage du click sur un div trigger du click sur le contenu
https://fiddle.jshell.net/sj3n5bgL/1