Cara Memasang Efek Getar di Blogger

arsipbiru_memasang-efek-getar-di-blogger

Arsipbiru.com - Selamat datang di Arsipbiru. Pada kesempatan kali ini, saya akan membagikan tutorial bagaimana cara memasang efek getar di Blogger. Seperti yang kita ketahui bahwa efek getar adalah salah satu fungsi tambahan yang memberikan efek bergetar pada setiap bagian blog ketika diklik. Efek getar pada tutorial berikut ini menggunakan script murni JavaScript dan dapat diterapkan pada setiap bagian blog, baik teks, gambar, link, dan lain-lain.


Sayangnya, efek getar ini hanya dapat dirasakan ketika pengunjung mengakses blog melalui perangkat mobile atau smartphone. Bagi pengunjung yang mengakses blog melalui PC tidak akan merasakan efek apapun pada bagian blog yang telah diberikan efek getar. Meskipun begitu, efek getar berikut ini dapat menjadi alternatif dalam memberikan efek pada bagian blog Anda agar terlihat keren dan profesional.


Cara Memasang Efek Getar di Blogger

Pada tutorial kali ini, ada beberapa cara yang dapat Anda pilih untuk memasang efek getar di blog Anda. Cara memasangnya cukup mudah, Anda cukup menambahkan beberapa baris kode JavaScript ke dalam template Anda.


Tutorial versi 1

Jika yang ingin Anda tambahkan efek getar tidak memiliki id atau class dan hanya ingin salah satu bagian blog (misalnya, icon) saja yang ingin diberikan efek getar, Anda dapat mencoba tutorial versi pertama ini. Caranya Anda cukup menambahkan kode JavaScript berikut ini.


navigator.vibrate(50)


Untuk contoh lengkapnya Anda bisa lihat di bawah ini.


function darkMode(){navigator.vibrate(50);localStorage.setItem("mode","darkmode"===localStorage.getItem("mode")?"light":"darkmode"),"darkmode"===localStorage.getItem("mode")?document.querySelector("#mainCont").classList.add("drK"):document.querySelector("#mainCont").classList.remove("drK")};


Tutorial versi 2

Di tutorial versi kedua ini, silahkan salin script di bawah ini dan letakkan di atas kode </body> atau &lt;!--</body>--&gt;&lt;/body&gt;

<script>/*<![CDATA[*/

var shK = document.querySelectorAll('.tIc,.mobMn li,.mnMn li'); for (var i = 0; i < shK.length; i++) {

  var gT = shK[i]; gT.addEventListener('click', function() {

    navigator.vibrate(50)});

}

/*]]>*/</script>

Anda dapat menambahkan id atau class lainnya dalam kode document.querySelectorAll.

Tutorial versi 3

Tutorial versi ketiga tidak jauh berbeda pada tutorial versi kedua, hanya saja berbeda dalam pemanggilan classnya. Silahkan salin script di bawah ini dan letakkan di atas kode </body> atau &lt;!--</body>--&gt;&lt;/body&gt;
<script>/*<![CDATA[*/ 

var getar = document.querySelectorAll('.getar');

for (var i = 0; i < getar.length; i++) {

    var getarr = getar[i];

    getarr.addEventListener('click', function() {

        navigator.vibrate(50)

    });

}

/*]]>*/</script>

Cara Penggunaan Efek Getar Versi Ketiga

Pada tutorial versi ketiga, untuk mengaktifkan efek getar, Anda cukup memanggil class getar pada elemen HTML yang ingin ditambahkan efek getar ketika diklik, bisa berupa tombol, link, gambar atau yang lainnya.

<!-- contoh efek getar pada tombol -->
<button class='getar'>klik di sini</button>

<!-- contoh efek getar pada link -->
<a class='getar' href='#'>ini tautan aktif</a>

<!-- contoh efek getar pada div -->
<div class='getar'>ini div</div>

Angka 50 adalah angka untuk mengatur besar kecilnya getaran yang ingin Anda buat. Anda dapat mengubah angka 50 dengan angka yang Anda inginkan.

Demikianlah tutorial singkat terkait bagaimana cara memasang efek getar di Blogger. Jika ada saran dan masukan, silahkan berkomentar yang sopan di bawah ini. Terima kasih atas kunjungannya dan semoga bermanfaat.

Sumber:

Mau donasi lewat mana?

Trakteer Saweria
N/A
Traktir creator minum kopi dengan cara memberikan sedikit donasi.
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
More Details