Langsung ke konten utama

Postingan

Menampilkan postingan dari Desember, 2024

Menampilkan Tanggal dan Waktu Secara Dinamis dengan JavaScript dan HTML

Pernahkah Anda ingin menampilkan waktu secara real-time di website Anda? Baik itu untuk mencatat aktivitas pengguna, menampilkan waktu posting artikel, atau sekadar memberikan sentuhan interaktif pada halaman web, menampilkan tanggal dan waktu secara dinamis dapat menjadi solusi yang menarik. Dengan memanfaatkan kekuatan JavaScript dan HTML, Anda bisa membuat elemen waktu yang selalu terbarui tanpa perlu me-refresh halaman. Dalam artikel ini, kita akan membahas langkah-langkah mudah untuk menampilkan time stamp secara dinamis, lengkap dengan beberapa tips untuk menyesuaikan tampilannya sesuai kebutuhan Anda. JavaScript: <script> function updateClock ( ) { const days = [ "Sun" , "Mon" , "Tue" , "Wed" , "Thu" , "Fri" , "Sat" ]; const months = [ "Jan" , "Feb" , "Mar" , "Apr" , "May" , "Jun" , "Jul" , "Aug" , ...

Cara Mengubah Text Biasa Menjadi Text Dengan Animasi Mengetik Menggunakan HTML, CSS dan JavaScript

Pernahkah Anda melihat teks yang muncul satu per satu seolah-olah sedang diketik langsung di layar? Efek ini sering digunakan untuk menambahkan kesan dinamis dan menarik pada website, terutama untuk memperkenalkan judul, pesan penting, atau elemen interaktif lainnya. Dalam artikel ini, kita akan belajar cara membuat efek animasi mengetik dengan mudah menggunakan HTML, CSS, dan JavaScript. Tidak hanya menambahkan estetika pada halaman web, efek ini juga dapat meningkatkan pengalaman pengguna dan memberi kesan profesional pada desain Anda. Mari kita mulai dan lihat bagaimana efek mengetik ini bekerja! JavaScript: <script> const text = "This is \n Typing Text Animation" ; const typingTextElement = document . getElementById ( "typing-text" ); let index = 0 ; let isDeleting = false ; function typeEffect ( ) { if (!isDeleting && index < text. length ) { if (text[index] === "\n" ) { ...