efek marquee - cara menmpilkan tulisan bergerak pd halaman blog

Halooo pengunjung... kita kembali lagi dalam tutorial HTML setelah beberapa minggu terakhir ini gencar memposting tutorial JAVASCRIPT dan untuk kali ini saya akan memberikan sedikit bocoran mengenai cara membuat efek marquee .. apa sih marquee itu dan yang gimana sih bentuknya...? pernah lihatkah anda tulisan yang bergerak atau berjalan kesamping kiri ke kanan atau sebaliknya dan atau bergerak dari atas kebawah atau sebaliknya..? nah.. itu namanya hasil pembentukan dari efek perintah marquee.
Oke dech.. kao udah punya gambaran mengenai apa itu marquee sekarang giliran saya akan memberikan contoh scriptnya.. dan ga berlama lama lagi akan saya tunjukkan scriptnya dan sekalian saya kasih penjelasannya, biar anda bisa mengubah dan mengembangkannya sendiri sesuai kebutuhan dan selera anda..
dibawah ini adalah perintah efek marquee default

<marquee>contoh kata kata anda disini</marquee>
dan hasilnya akan nampak seperti ini :
contoh kata kata anda disini
...

Contoh diatas adalah perintah marquee yang tanpa embel embel lainnya.. seumpama anda ingin menempatkan dalam halaman yang lebarnya sekian atau tingginya sekian.. maka perlu ditambahin embel embel width: lebar dan height: tinggi dan masih banyak lagi embel embel lainnya.. tapi tenang aja akan saya bahas satu persatu mengenai embel embel tersebut..
Coba anda sekarang lihat contoh script dibawah ini, baru penjelasannya dibawahnya:

<marquee behavior='alternate' bgcolor='#ADFF2F' scrollamount='8' width='400px'><span style='color:red'>tulisan anda taruh sini</span>
</marquee>

hasilnya akan nampak seperti ini :

tulisan anda truh disini

keterangan :

• behavior= adalah untuk mengatur perilaku gerakan, untuk kasus contoh diatas adalah 'alternat' yaitu bergerak bolak balik dari kiri kekanan/sebaliknya, nah jika anda pengen perintah perilaku yang lainnya seumpama bergerak sekali saja lalu berhenti adalah 'slide' atau 'scroll' yaitu bergerak berputar .. nah anda bisa mencobanya sendiri ntar satu satu biar tau dengan jelas dan puas... hehehe..
• bgcolor: adalah untuk mengatur warna backgroun .. bisa anda isi sesui yg anda inginkan.
• scrollamount= adalah perintah kecepatan gerakan, jika anda ingin lebih cepat maka anda perbesar jumlah angkanya dan sebaliknya jika pengen diperlambat.
• width: adalah perintah untuk membuat lebar, jika ingin ditambahkan bisa di dtambahin height: yaitu untuk ukuran tinggi.
• dan yang terakhir adalah span color: yaitu untuk mengatur warna text yang bergerak.

Selanjutnya lihat juga contoh yang berikutnya yaitu :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="170" height="100" >kata kata anda disini
kata kata anda disini
kata kata anda disini
kata kata anda disini
kata kata anda disini</marquee>

hasilnya akan nampak sebagai berikut :

kata kata anda disini
kata kata anda disini
kata kata anda disini
kata kata anda disini
kata kata anda disini

keterangan :

• onmouseover="this.stop()" : adalah perintah yang mana jika mouse anda letakkan diwilayah area teks yang anda kasih efek marquee akan berhenti bergerak.
• onmouseout="this.start()" : adalah kebalikan dari diatas, yaitu jika mouse anda lepaskan lagi maka akan kembali bergerak.
• direction="up" : adalah untuk mengatur perintah berjalan kearah atas. jika pengen kearah bawah ganti kata "up" dengan kata "down"
• keterangan selebihnya kayak diatas yah..

Setelah anda memahami penjelasang diatas.. anda bisa mengkolaborasikan antar masing.. yah sekedar bereksperimen gtu... ga papa ko.. ga meledak... hehehe..

Oke dech.. selamat mencoba yah.. jika ada yang bingung bisa ditanyakan lewat post komentar dibawah yah... atau pengen tanya style gerakan yang lainnya bahkan..? silahkan di muntahkan aja yah.. keburu membeku ntar.. wekekekeke...
GUD.. LUK...

Posted by ayiek

Tweet