Menutup suatu element saat melakukan click di luar element tersebut

Saya kebetulan masih fresh bgt di javascript, mungkin pertanyaan ini udah banyak bgt di forum lain termasuk di stackoverflow, abis dari sana dan udah cari-cari gimana caranya, tapi agak susah implementasiinnya ke dalam masalah yg saya hadapi.

kodenya disini https://jsfiddle.net/16L8cbht/

jadi ada 2 parent div yang pertama dengan; id "#sidebar" dan class ".sidebar", dan yg kedua dengan; class ".menu-icon" tanpa id.

yang saya mau dari fungsi tersebut adalah bagaimana saya bisa "menutup" sidebar dengan mengklik bagian apapun dari document, tetapi sidebar masih akan terbuka apabila user berinteraksi atau klik pada sidebar dan child element itu sendiri??

trims!

javascript jquery

@rubichandrap

25 Kontribusi 19 Poin

Diperbarui 5 tahun yang lalu

1 Jawaban:

Jawaban Terpilih

coba cara ini gan, ganti bagian container dengan siderbar div kamu <pre> $(document).mouseup(function(e) { var container = $("YOUR CONTAINER SELECTOR");

// if the target of the click isn&#039;t the container nor a descendant of the container
if (!container.is(e.target) &amp;&amp; container.has(e.target).length === 0) 
{
    container.hide();
}

}); </pre>

sumber <a href=' https://stackoverflow.com/questions/1403615/use-jquery-to-hide-a-div-when-the-user-clicks-outside-of-it '>stackoverflow detect container onclick</a>

@hilmanski

2686 Kontribusi 2135 Poin

Dipost 5 tahun yang lalu

Tanggapan

works perfectly fine! tapi ketika make container.hide(); semua animasi css jadi ga jalan alias ga kepanggil, jadi saya buat dulu fungsi sendiri diatasnya, kemudian panggil fungsi tersebut. THANKS Mas Hilman!

@rubichandrap

terima kasih juga sudah share!

@hilmanski

Kelas Premium! Belajar Javascript untuk website

Menutup suatu element saat melakukan click di luar element tersebut

Kelas Premium!
Belajar Javascript untuk website