Minggu, 15 Januari 2012

Berbagai variasi cara membuat tulisan berjalan


 Font tutorial twinkle blink Cara membuat tulisan / Huruf bergerak berjalan

Sebenarnya saya malas menulis tutorial cara membuat tulisan / Huruf kelap kelip pada posting blog ini, karena mungkin terlalu singkat dan mudah. Tapi setelah di pikir-pikir, ternyata berguna juga bagi yang membutuhkan, mungkin waktu mereka akan posting atau memang benar-benar belum tau bahwa tulisan kelap-kelip ini ternya bisa di buat di dalam posting blog dan sebagainya. maka harus saya sharing info ini, supaya teman-teman semua akan tau. oke?

Lalu bagaimana caranya ? sobat tinggal menambahkan kode blink di awal dan akhir tulisan yang akan di buat kelap-kelip, seperti ini :

<blink> taruh tulisan disini </blink> 

maka hasilnya akan seperti ini:
taruh tulisan disini


Tulisan bergerak ke kiri
<marquee direction="left"><span style="color: grey; font-weight:bold;">Tulisan bergerak ke kiri</span></marquee>


Tulisan bergerak ke kanan
<marquee direction="right"><span style="color: rgb(61, 91, 152); font-weight:thin;">Tulisan bergerak ke kanan</span></marquee>


Tulisan bergerak bolak-balik
<marquee behavior="alternate" direction="left"><span style="color: #38d878; font-weight: bold;">Tulisan bergerak bolak-balik</span></marquee>


Tulisan bergerak bolak-balik dan bisa di stop
<marquee direction="right" behavior="alternate" scrollamount="2" onmouseover="this.stop()" onmouseout="this.start()" width="75%"><span style="color: rgb(61, 91, 152); font-weight: bold;">bolak-balik dan bisa di stop</span></marquee>


Setting kecepatan tulisan
<marquee direction="left" scrolldelay="10"><span style="color: rgb(59, 207, 239); font-weight: bold;">Setting kecepatan tulisan</span></marquee>


Tulisan bergerak sambil kelap-kelip
<marquee direction="right"><blink><span style="color: #3d5b98;">Tulisan bergerak sambil kelap-kelip</span></blink></marquee>


Tulisan link bergerak
<marquee direction="left"><a href="http://caraonline.blogspot.com/" target="_blank"><span style="color: #c069f8;">Tulisan link bergerak</span></a></marquee>


     Keterangan:
  • untuk gerakan arah kiri kanan, ubah tulisan left menjadi right atau sebaliknya
  • untuk merubah warna tulisan, setting pada tulisan color atau 3 angka rgb di dalam kurung
  • untuk merubah ukuran tebal tipis tulisan, ubah tulisan bold menjadi thin atau sebaliknya.
  • untuk setting kecepatan, ubah / tambah nilai pada scrolldelay
  • Selanjutnya, silahkan bereksperimen sendiri :)

0 komentar