Membuat teks berjalan

Sebenarnya trik ini sudah lama, sudah basi, tapi baru sempat saya posting. Tutorialnya saya kutip dari blog, cara membuat teks (marquee), ikuti langkah berikut untuk membuatnya...
Agar lebih mudah adabaiknya ingat baik baik langkah pertama, biasanya kode umum pada teks marque seperti ini :

• Width; Lebar marquee, Satuan bisa pixel atau %.
• Height; Tinggi marquee, Sauan bisa pixel atau %.
• Bgcolor; Warna latar belakang marquee, Contoh : putih #fff.
• Behavior; Perilaku text, Pilihan : scroll, slide, alternate
• Scrollamount; kecepatan text bergerak, Satuan; 1, 2, 3, makin besar angkanya maka akan makin cepat jalannya
• Scrolldelay; Kecepatan text bergerak, Satuan 1, 2, 3, semakin besar angkanya maka akan makin lambat
• Direction; Teks bergerak dari arah mana, Pilihan left, right, top, dan bottom, up, down.

Langkah kedua, berikut contoh teks dengan efek marquee
Contoh 1

Taruh Text Yang Anda Inginkan Disini

Kode teks marque (Contoh 1) di atas seperti ini
<br /> <marquee behaviour="alternate" scrollamount="4" width="100%" > Taruh Text Yang Anda Inginkan Disini</marquee> <br />
keterangan:

• Tanpa direction berarti arahnya memakai default maka akan dari kiri ke kanan
• Tanpa background berarti warnanya akan menyatu dengan warna background default blog anda.
• Width 100 % berarti lebar 100 dari lebar default. Dapat menyesuaikan diri sesuai dengan lebar default blog.

Contoh teks marquee (2):

tulis teks kamu disini

Kode contoh (2) seperti ini
<br /> <marquee behaviour="alternate" bgcolor="#000000" scrolldelay="5" width="400px"><span style="color: white;" direction="left">tulis teks kamu disini</span></marquee> <br />
Keterangan contoh (2) :

• Bgcolor adalah warna background , bisa kalian ganti dengan warna lain.
• Width adalah lebar, disini saya menggunakan pixel sehingga tidak seperti contoh 1 yang menyesuaikan diri dengan lebar post.
• Height adalah tinggi, sebaiknya anda menggunakan pixel pada height.
• Span color adalah warna tulisan anda bisa menggantinya dengan warna lainnya.
• Direction left berarti arahnya terus dari kiri ke kanan tanpa terputus, anda bisa menggunakan right jika ingin arah sebaliknya.

Contoh teks marquee (3):

Text Turun
Text Turun
Text Turun
Text Turun
Text Turun

Kode contoh marquee (3):
<br /> <marquee direction="down" height="200" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="3" width="300px">Text Turun<br /> Text Turun<br /> Text Turun<br /> Text Turun<br /> Text Turun</marquee><br />
Keterangan contoh (3):

• Direction down berarti arah datang dari bawah ke atas , bisa diganti dengan up jika kamu mau text turun ke bawah.
• Onmousover berarti text berhenti pada saat cursor diarahkan ke text tersebut.
• Onmouseout berarti text kembali bergerak pada saat cursor tidak diarahkan ke text.

Untuk mengatur tingkat kecepatan bergerak, kamu tinggal menambahkan perintah scrollamount setelah perintah marquee, dengan nilai scrollamount ≠ 0 (jika nol tidak akan bergerak), seperti contoh berikut:

<marquee scrollamount="2">TULISAN BERJALAN</marquee>
<marquee scrollamount="3">TULISAN BERJALAN</marquee>
<marquee scrollamount="4">TULISAN BERJALAN</marquee>

scrollamount="3">TULISAN BERJALAN
scrollamount="5">TULISAN BERJALAN
scrollamount="7">TULISAN BERJALAN
Semakin besar nilai scrollamount-nya, akan semakin cepat bergeraknya, dan sebaliknya.


Untuk menambahkan backgound pada tulisan, kamu cukup menambahkan perintah bgcolor="warna" (warna: red, blue, orange, green, dll) atau perintah bgcolor="#kode warna" (mengenai kode warna silahkan baca artikel ini) pada perintah-perintah tadi, seperti contoh berikut:

<div style="color: black;">
<marquee behavior="alternate" bgcolor="orange" direction="left"><b>TULISAN BOLAK-BALIK</b></marquee></div>
<div style="color: black;">
<marquee behavior="alternate" bgcolor="#fdeae8" direction="right"><b>TULISAN BOLAK-BALIK</b></marquee></div>

TULISAN BOLAK-BALIK

TULISAN BOLAK-BALIK

Silahkan di utak atik sendiri, ubah tampilan sesuai keinginan kamu, selamat mencoba...

posted by rhoel macazzart:) Read more: http://www.bloggerafif.com/2011/01/membuat-auto-readmore-pada-blogspot.html#ixzz1SMV0Oahe