Cara Mematikan / Mengaktifkan Javascript di Media Screen Tertentu

Cara Mematikan/Mengaktifkan Javascript di Media Screen Tertentu

Javascript memiliki peranan yang sangat penting pada suatu blog. Selain berguna untuk mempercantik tampilan blog, Javascript juga dapat menambah fitur-fitur baru di dalam blog.

Masalahnya, tidak semua Javascript cocok dipakai pada media screen tertentu. Saya pernah mengalaminya.

Misal Javascript untuk widget sticky saya. Widget sticky akan mengalami bug yaitu blog tidak dapat di scroll sampai ke footer bila blog diakses melalui media screen tertentu (biasanya dibawah 900px alias tampilan mobile)...

Dikarenakan layar akan tertutupi oleh widget yang sticky dan hanya berhenti diatas footer. Lalu, saya mencoba memakai cara ini untuk mematikan scriptnya pada media screen untuk mobile dan berhasil.

Oleh karenanya, kali ini saya akan membagikan sedikit cara untuk mematikan atau bisa juga dipakai untuk mengaktifkan Javascript pada media query screen tertentu. Langsung saja disimak langkahnya berikut ini.

Javascript pada Media Query Screen


Tentunya, pertama siapkan Javascript yang ingin anda matikan/aktifkan. Kali ini saya berikan contoh seperti gambar dibawah ini.

<script type='text/javascript'> //<![CDATA[

//ini kode javascript contoh

//]]> </script>

Selanjutnya, tempatkan kode:

$(window).width(function() {    if ($(this).width() > 940) {

tepat diatas kode javascript anda dan kode:

   } }); 

tepat dibawah kode javascript. Sehingga penampilannya secara penuh seperti ini:

<script type='text/javascript'> //<![CDATA[
$(window).width(function() {    if ($(this).width() > 940) {

// ini kode javascript contoh

}});
//]]> </script>

Sekarang, anda simak baik-baik kode diatas. Disana terdapat kode:

.width() > 940 

Kode tadi memiliki arti bahwa Javascript hanya akan diaktifkan pada media screen dengan width melebihi 940px saja. Sedangkan pada media screen kurang dari 940px, Javascript menjadi tidak aktif alias mati. Anda juga dapat mengganti kode > menjadi < dan sebaliknya.

Sudah mengerti maksudnya? Bila iya, silahkan sekarang anda bereksperimen dan menyesuaikan dengan keperluan anda! Berikut beberapa contoh lainnya supaya anda lebih mengerti tentang cara penggunaan media query pada Javascript ini.

.width() > 940 
Aktif hanya pada media screen lebih dari 940px dan Mati pada media screen kurang dari 940px

.width() < 940  
Aktif hanya pada media screen kurang dari 940px dan Mati pada media screen lebih dari 940px

Selamat mencoba dan semoga berhasil!

Sabtu, Juni 17, 2017 - 5 komentar

5 komentar untuk Cara Mematikan / Mengaktifkan Javascript di Media Screen Tertentu.

Silakan masukkan komentar anda. Jangan habiskan waktu hanya untuk melakukan SPAM disini.


Perlihatkan Semua Komentar Tutup Semua Komentar
.
Wuwuh
Sabtu, 09 September 2017 21.58.00 WITA

pak ganti url ane pakkk di partner

Name : Free Net Url: akunssh.zone ubah jadi http://www.azwi.cf/

Balas Hapus
.
Ozik Jarwo
Minggu, 10 September 2017 08.57.00 WITA

Siap gan lagi diproses...

Balas Hapus
.
Qoqok Dwi Sunarko
Sabtu, 06 Januari 2018 15.34.00 WITA

Bingung sekali saya

Balas Hapus
.
Ozik Jarwo
Minggu, 07 Januari 2018 10.31.00 WITA

Silakan di ask ke saya kalau bingung...

Balas Hapus