Thursday, April 1, 2010

membuat teks berjalan(marquee)

Sebelum ini saya ada memuatkan artikel bagaimana membuat teks berkelip.Kali ini saya akan tunjukkan pula cara bagaimana hendak membuat teks berjalan atau pun marquee text pada blog.

Berikut adalah kod yang kita gunakan:

<marquee>Teks bergerak</marquee>

teks bergerak


Marquee yang biasa(standard) bergerak dari kanan ke kiri,kita boleh mengubahnya kepada beberapa bentuk gerakan dan keadaan dengan tambahan kod seperti dibawah:

bgcolor=warna latar belakang
direction=arah gerakan (left,right,up.down)
behavior=karekter pergerakan (scroll,slide,alternate)
scroll(teks berputar)
slide(teks bergerak sekali dan berhenti)
alternate(teks bergerak dari kiri ke kanan dan berpatah balik)
Title=perkataan muncul semasa mouse berada di atas teks
Scrollamount=meletak kecepatan gerakan
Scrolldelay=mengatur tempoh masa
Loop=mengatur jumlah



Dari arah kiri ke kanan

<marquee direction="right" >dari kiri ke kanan</marquee>

dari kiri ke kanan

Arah kiri dan kekanan kemudian berpatah balik


<marquee behavior="alternate" >Arah kiri dan kekanan kemudian berpatah balik</marquee>

Arah kiri dan kekanan kemudian berpatah balik


Dari kiri ke kanan dengan tempoh masa "10"

<marquee direction="right" scrollamount="10" >dari kiri ke kanan dengan tempoh masa 10</marquee>

dari kanan ke kiri jarak masa 10



Halakan pointer mouse pada teks dan ia berhenti

<marquee behavior="alternate" onmouseover="this.start()" onmouseout="this.stop()">arahkankan mouse pada teks,berhenti</marquee>

arahkankan mouse pada teks,berhenti




Jika ingin buat turun atau naik gantikan direction="down" atau "up"

<marquee bgcolor="yellow" direction="down" height="100" width="70%">dari atas ke bawah</marquee>


dari atas ke bawah


Teks dengan latar belakang warna


<marquee width="70%" bgcolor="green">dari kanan ke kiri</marquee>

dari kanan ke kiri

untuk meletakkan marquee contohnya pada sidebar:
Masuk kedesign-pilih Page Elements
Add A gadget--Javascript
masukkan kod yang salin padanya dan save.

No comments:

Post a Comment

Gambar Belangkas