MoreLesson 275Preview gratis
JS Media Queries
Lesson ini bagian dari How To · Semua level
Ringkasan
JavaScript dapat membaca media query yang sama seperti CSS melalui window.matchMedia(). Objek yang dihasilkan memiliki properti matches untuk mengetahui apakah query sedang aktif, serta event change ketika hasilnya berubah. Ini berguna ketika perilaku JavaScript, bukan hanya tampilan, perlu menyesuaikan ukuran layar.
Poin kunci
- window.matchMedia('(max-width: 600px)') membuat objek MediaQueryList.
- Properti matches bernilai true jika query sedang cocok.
- Event change dipicu saat viewport berubah melewati breakpoint.
- Hapus listener saat tidak diperlukan untuk menghindari kebocoran memori.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.