×

search by faronesia.com

Faronesia
Profesional and Specialist ReDesign Template blogger

Cara mudah membuat tulisan berkedip pada blog

Faronesia.com - Hay sahabat faronesia, pastinya dalam pembuatan sebuah halaman web, tidak lepas dari pentingnya desain web, interface dan kesesuaian dengan tema. Banyak sekali jenis desain web yang membutuhkan berbagai style untuk menunjang web tersebut tampil sesuai kebutuhan dan lebih mudah dipahami oleh pengunjungnya.

Nah pada kesempatan kali ini kita akan membuat tulisan berkedip menggunakan html dan CSS saja. Cara ini sangat rekomended sekali karena tanpa menggunakan javascript sehingga web/blog lebih optimal saat pemuatan atau loading. Tutorial ini dibuat dengan sesimpel-simpelnya namun mudah dipahami.

Agar pemasangannya berjalan dengan lancar ada baiknya anda membackup template blog anda sebelum di modifikasi. Hal ini berguna untuk jaga-jaga jika anda salah menempelkan kode yang menyebabkan error pada template.

Cara mudah membuat tulisan berkedip pada blog


  • Masuk ke dashboard blog milik anda
  • Lalu masuk ke menu tema blog
  • Kemudian klik edit HTML
  • Cari kode ]]></b:skin> lalu tambahkan kode CSS dibawah ini tepat diatas kode tadi
.farokedip {
  animation: blink-animation 1s steps(5,start) infinite;
  -webkit-animation: blink-animation 1s steps(5,start) infinite;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
  • Setelah itu simpan template
  • Selanjutnya, pasang kode HTML berikut ini sesuai keinginan anda (widget, dalam postingan, atau halaman statis)
<div class="farokedip">Ini adalah teks kedip</div>
  • Selesai, lalu simpan

Ini adalah teks berkedip
Keterangan singkat CSS teks kedip/blink diatas
  • .farokedip = merupakan nama class yang nantinya disisipkan pada kode HTML.
  • animation = merupakan nama properti yang berfungsi untuk memberikan perintah animasi pada class farokedip.
  • blink-animation = meruapkan nama animasinya, dapat diubah sesuai keinginan.
  • 1s = merupakan waktu delay, yaitu animasi dimulai setelah 1 detik.
  • steps(5,start) = merupakan fungsi timing.
  • infinite = merupakan durasi animasi perulangan tanpa batas.
Demikianlah mengenai Cara mudah membuat tulisan berkedip pada blog semoga bermanfaat untuk para pembaca dimanapun anda berada. Jika menurut anda artikel ini bermanfaat jangan lupa share karena dengan share artikel ini sama halnya anda berpartisipasi dalam mengembangkan website faronesia.

Post a Comment

1. Berkomentarlah dengan tata bahasa yang baik agar orang lain tahu sebijak apa karakter anda melalui kata kata.
2. Silahkan tulis komentar anda untuk hal apapun yang masih berhubungan dengan post pada halaman ini.
3. Mohon untuk tidak menyertakan Link Aktif pada kolom komentar.
4. Mohon maaf apabila tidak sempat membalas komentar 1 per 1.
5. Komentar selalu di moderasi.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

Notifikasi pengguna

Tetap selalu terhubung dengan kami untuk menjadi bagian dari Faronesa caranya cukup dengan menekan tombol dibawah ini.

Tutup
×

Faronesia

Kami senantiasa membantu memecahkan masalah seputar desain blog melalui request tutorial

Request tutorial