Dalam kesempatan kali ini teknologi[dot]visitklaten[dot]com akan berbagi cara membuat efek pengetikan atau typing effect yang seperti mesin ketik dengan Javascript.
Tanpa plugin dengan bermodalkan Javascript yang cukup sederhana dan simple maka rekan-rekan bisa membuat efek pengetikan seperti mesin ketik di wordpress.
Efek pengetikan ini yakni sebuah tulisan/paragraph akan muncul secara perlahan huruf demi huruf dengan kecepatan sesuai settingan yang dibuat.
JavaScript adalah suatu bahasa pemrograman level tinggi yang pada awalnya didesain untuk membuat efek interaktif pada browser. Dahulu bahasa pemrograman ini sebagian besar hanya digunakan untuk program-program front-end. Akan tetapi sekarang ruang lingkupnya sudah lebih luas dan menjadi favorit Pengembang sepanjang masa.
JavaScript memiliki daftar framework yang tidak ada habisnya. Dilengkapi dengan library, dan juga solusi perangkat lunak seperti Electron, node.js, Angular JS, dan masih banyak lagi lainnya. JavaScript saat ini sudah digunakan untuk membuat program front-end, back-end, dan juga berbagai macam permainan.
Sebelumnya kami mengucapkan terima kasih kepada para pengunjung teknologi[dot]visitklaten[dot]com yang telah meluangkan waktunya untuk mengunjungi website kami yang masih banyak kekurangan ini. Kami menerima segala masukkan dan kritikan agar web dan diri kami menjadi lebih baik lagi.
Cara Membuat Efek Pengetikan
Untuk membuat efek pengetikan meskipun menggunakan javascript namun cukup mudah untuk membuatnya. Silakan lihat contoh dibawah ini nanti tinggal diganti tulisannya dan kecepatan pengetikannya. yuk cap cuz
Pertama, silakan copy paste kode dibawah ini. catatan kami menggunakan style boostrap jadi untuk style CSS nanti bisa menyesuaikan sesuai selera masing-masing
<button onclick="typeWriter()" class="btn-blue-gradient mt-3 rounded">Klik Untuk Melihat Hasilnya</button>
<p id="typeWriter" class="mt-3"></p>
<script>
var i = 0;
var txt = 'VisitKlaten[dot]Com - Peta Pariwisata dan Media Iklan Di Kabupaten Klaten. Merupakan Media Informasi Pariwisata, Serba-Serbi Pariwisata dan Media Iklan di area Klaten, Surakarta, Jogja, Karanganyar, Boyolali, Sragen dan Sekitarnya'; /* isi dengan teks yang diinginkan */
var speed = 50; /* Kecepatan atau durasi efek dalam milidetik */
function typeWriter() {
if (i < txt.length) {
document.getElementById("typeWriter").innerHTML += txt.charAt(i);
i++;
setTimeout(typeWriter, speed);
}
}
</script>
Terima kasih telah mengunjungi website kami.
Share jika bermanfaat, jika ada kritik, tambahan, pertanyaan atau saran silakan hubungi kami atau silakan isi di kolom komentar.
Komentar