Search More

Kamis, 12 Juni 2008

Tag Marquee

Apa sich marquee itu? apakah sejenis makanan ringan? Bagaimana bentuknya?? Untuk Apa fungsinya ya???


Semakin banyak tanda tanya didalam hati kita semakin bingunglah diri kita. Mudah-mudahan tanda tanya tersebut akan semakin berkurang seiring dengan membaca tutorial kali ini. Dalam hal ini saya tidak akan terlalu panjang lebar menjelaskan detail-detail marquee dalam bahasa HTML tersebut. Loh kenapa begitu? jawabnya adalah karena saya lebih mengutamakan logikanya daripada mendoktrin.


Baiklah, sebagai pendahuluan saya akan memberikan definisi marquee. Marquee secara umum didefinisikan sebagai text berjalan(berbagai definisi ambigu marquee dari wikipedia disini), fungsi ini biasanya dipergunakan untuk menghemat tempat pada halaman web ataupun untuk mempercantik tampilan web. Sebagai contoh, apabila kita mempunyai link ke situs lain dengan jumlah yang banyak, katakanlah 200 link, tentu saja apabila seluruh link tersebut ditampilkan di halaman web makan sebagian besar halaman web kita akan berisi link dibandingkan postingannya sendiri dan tentu saja tidak semua pengunjung yang senang akan hal ini. Hal ini dapat diatasi dengan fungsi marquee, selain menghemat tempat juga mempercantik tampilan web.


Secara umum tag marquee seperti dibawah


<marquee>text yang akan di modifikasi </marquee>


Fungsi marquee ini tentu saja tidak dapat berdiri sendiri seperti diatas, fungsi ini membutuhkan tambahan/perintah penyokong. Analoginya seperti ini, apabila kita memerintah sebuah teks "ayo berjalan" maka teks tersebut akan berjalan sesuai dengan kebiasaannya yaitu dari kanan ke kiri. Teks juga punya kebiasaan loh. Dan hal ini menjadi masalah apabila kebiasaan/default teks tersbut tidak sesuai dengan yang kita inginkan.


Untuk itulah dibutuhkan penyokong fungsi marquee, seperti yang terangkum dibawah (beberapa penyokong yang sering dipergunakan):

































Fungsi penyokong
Kegunaan
Isi
<marquee behavior=" ">
untuk mengatur tingkah teks, berjalan terus, berupa slide atau berlawanan
slide, scroll, altenate
<marquee bgcolor=" ">
untuk memberikan warna latar belakang marquee

<marquee direction=" ">
untuk menentukan arah pergerakan teks

up, left, down, right

<marquee onmouseover=" " onmouseout=" ">

untuk menentukan pengaruh teks pada saat kursor melewatinya

this.stop, this.start
<marquee scrolldelay=" ">
menentukan laju teks

1 - ~ atau 1% - ~ %
<marquee width=" " height=" ">
mengatur besar tempat yang disediakan untuk marquee

1 - ~ atau 1% - ~ %
<marquee style="text-align:center">
mengatur posisi teks

center, left, right, justify
<marquee style="border:medium black ">
mengatur garis kolom marquee
beserta warnanya

medium, thin, thick, dashed, double, dotted, grove, solid, hidden, dll.

Penulisan marquee teks ini dapat disertakan beberapa fungsi penyokong sekaligus, antar fungsi penyokong dipisahkan dengan spasi dan isi penyokong diapit kutip ganda " ".



Beberapa contoh marquee text:


bila kita tulis :





<marquee width="200" height="100" bgcolor="#CCCCCC direction="up" scrolldelay="300%" style="text-align: center" style="border: dotted #33FF66>
test<p>fungsi<p>marquee<p>dulu ah<p></marquee>




maka hasilnya seperti ini:




test

fungsi


marquee


dulu ah




Note: tanda <p> pada bahasa HTML digunakan untuk menggati garis/row berikutnya



contoh lainnya




<marquee width="200" height="50" bgcolor="red" direction="left" behavior="alternate" scrolldelay="300%" style="text-align: center">
test fungsi marquee dulu ah</marquee>




Hasilnya seperti ini:


test

fungsi

marquee

dulu ah



Saya rasa tutorial marquee ini cukup disini dulu sebab saya sudah capek nich, he he he, nanti saya lanjutkan lagi dikesempatan berikutnya. Dan selamat mencoba, jangan ragu-ragu untuk memodifikasi web anda dengan mencoba mengkombinasikan fungsi-fungsi yang ada.Marquee ini juga dapat dipergunakan di Friendster, pada about me atau customize yang lainnya selama mendukung bahasa HTML.

Suprih Rustanto mengatakan...

salam kenal dari blogger semarang, wah saya lag belajar ne, makasih ya. tulisan favorite minggu ini: Sejuta Rasa Kuliner Semawis

Anonim mengatakan...

Keren!
Masih awam banget nih sama yang namanya Coding.. (T-T)

Thanks buat infonya!