Mungkin anda pernah menjumpai text berjalan atau text yang berkedip pada beberapa website atau blog.
Sebenarnya tidaklah sulit untuk membuat text yang anda inginkan dibuat berjalan atau berkedip-kedip seperti itu. Anda hanya perlu menambahkan beberapa perintah bahasa pemprograman saja. Anda ingin mencobanya ??
1. Membuat Teks berkedip
Misalnya anda ingin membuat text : " HALLO APA KABAR ??? " ini berkedip.maka perintahnya adalah : <blink>Text </blink>:
Contoh 1 :
<head>
<body>
<blink>HALLO APA KABAR ???</blink>
</body>
</head>
<body>
<blink>HALLO APA KABAR ???</blink>
</body>
</head>
maka hasilnya adalah seperti ini :
2. Membuat Teks menjadi tebal
Dan jika anda menginginkan Text tersebut Tebal anda tinggal menambahkan perintah "bold" : <b>Text</b>Contoh 2 :
<head>
<body>
<blink><b>HALLO APA KABAR ???</b></blink>
</body>
</head>
<body>
<blink><b>HALLO APA KABAR ???</b></blink>
</body>
</head>
maka hasil dari program di atas adalah seperti di bawah ini :
3. Membuat Teks berjalan
Dan jika anda menginginkan text tersebut berjalan maka anda bisa menambahkan perintah "marquee" : <marquee>Text</marquee>Contoh 3 :
<head>
<body>
<marquee><b>HALLO APA KABAR ???</b></marquee>
</body>
</head>
<body>
<marquee><b>HALLO APA KABAR ???</b></marquee>
</body>
</head>
maka hasilnya akan tampak seperti di bawah ini :
4. Membuat Teks berjalan dari kiri ke kanan
Pada contoh no. 3 di atas teks berjalan dari arah kanan ke arah kiri, Nah jika anda ingin Teks berjalan ke arah sebaliknya yaitu dari arah kiri ke kanan, maka code perintah programnya adalah sebagai berikut :Contoh 4 :
<head>
<body>
<marquee align="center" direction="right" height="45" scrollamount="2" width="70%">
HALLO APA KABAR ?
</marquee>
</body>
</head>
<body>
<marquee align="center" direction="right" height="45" scrollamount="2" width="70%">
HALLO APA KABAR ?
</marquee>
</body>
</head>
Dan hasil tampiannya akan anda dapati seperti di bawah ini :
Note :
Pada huruf / angka yang berwarna merah dapat anda sesuaikan menurut keinginan, kata "right" adalah perintah untuk menggerakkan teks ke arah kanan. Anda dapat merubahnya menjadi "left" jika ingin teks berjalan dari arah kanan ke arah kiri.
Huruf "45" pada kode diatas adalah untuk mengatur ukuran tinggi bidang gerak teks, anda dapat merubahnya dan menyesuaikan menurut ukuran bidang gerak pada website / blog anda.
Sedangkan huruf "2" pada perintah scrollamount adalah untuk mengatur kecepatan gerak teks. Semakin besar nominalnya maka kecepatan gerak teks akan semakin bertambah.
"70%" pada code width diatas adalah ukuran lebar bidang gerak teks. Anda bisa merubah prosentasenya sesuai dengan keinginan anda.
5. Membuat teks berjalan ke kiri dan kembali ke kanan :
Untuk membuat teks berjalan ke kiri lalu kembali kekanan, code programnya adalah sebagai berikut :
Contoh 5 :
<head>
<body>
<marquee align="center" direction="left" height="50" scrollamount="5" width="70%" behavior="alternate">
<b>HALLO APA KABAR ?</b>
</marquee>
</head>
</body>
<body>
<marquee align="center" direction="left" height="50" scrollamount="5" width="70%" behavior="alternate">
<b>HALLO APA KABAR ?</b>
</marquee>
</head>
</body>
Code program diatas akan menghasilkan tampilan seperti di bawah ini :
6. Membuat Teks berjalan / bergulir dari atas ke bawah atau sebaliknya :
Jika anda ingin membuat teks bergulir dari bawah ke atas atau sebaliknya dari atas ke bawah, maka dapat menggunakan code program seperti berikut ini :Contoh 6 :
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="70%" height="80" align="center">
<a href="http://dejavanta.blogspot.com" target="new">dejavanta.BloG</a><br />
<a href="http://dejavanta.blogspot.com/2011/04/membuat-text-berjalan-pada-blog.html" target="new">Tutorial Membuat animasi teks pada Blog</a><br />
<a href="http://dejavanta.blogspot.com/p/software.html" target="new">Free Downloads Software</a><br />
<a href="http://http://dejavanta.blogspot.com/2011/04/tips-agar-cartridge-printer-anda-awet.html" target="new">Tips</a><br />
</marquee>
<a href="http://dejavanta.blogspot.com" target="new">dejavanta.BloG</a><br />
<a href="http://dejavanta.blogspot.com/2011/04/membuat-text-berjalan-pada-blog.html" target="new">Tutorial Membuat animasi teks pada Blog</a><br />
<a href="http://dejavanta.blogspot.com/p/software.html" target="new">Free Downloads Software</a><br />
<a href="http://http://dejavanta.blogspot.com/2011/04/tips-agar-cartridge-printer-anda-awet.html" target="new">Tips</a><br />
</marquee>
Maka tampilan teks akan menjadi seperti di bawah ini :
Teks bergulir ke atas :
Teks bergulir dari atas ke bawah :
Note :
Teks pada contoh 6 di atas selain bergulir juga sekaligus dapat di koneksikan (link) ke alamat situs atau halaman lain. Anda tinggal mengganti huruf yang berwarna biru sesuai dengan yang anda inginkan. Jadi begitu teks tersebut di klik maka secara otomatis akan langsung menuju pada sourch yang di tuju pada tab baru.
Sedangkan untuk membuat teks bergulir dari atas ke bawah, anda tinggal mengganti kode "up" yang berwarna merah menjadi "down".
Selamat Mencoba !!!
Postingan
Tidak ada komentar:
Posting Komentar