Friday, November 5, 2010

Cara Membuat Tulisan Berjalan Pada Website / Blogspot

Baiklah, Untuk tutorial blogging kali ini saya akan membahas, cara membuat tulisan berjalan pada website / blogspot. Sebuah web / blog yang dibuat dengan penuh kreatifitas akan membuat
pengunjung betah berlama -lama ketika mengunjunginya. Salah satu kreatifitas yang dapat anda lakukan adalah dengan menambahkan tulisan berjalan yang akan membuat tampilan web / blog anda lebih atraktif dan animatif. Coba deh simak yang dibawah ini:

Tulisan berjalan tersebut biasa disebut sebagai text marquee.

Marquee sebenarnya sebuah tag HTML yang digunakan untuk membuat konten (isi) website menjadi bergerak. Kali ini kita hanya akan belajar membuat teks berjalan saja. Secara sederhana, tag marquee tersebut ditulis dalam bentuk:

<marquee>TEXT HERE</marquee>

Secara otomatis, tulisan “TEXT HERE” yang dibungkus oleh tag marquee tersebut akan bergerak pada website kita.
Agar tulisan berjalan yang kita buat tersebut lebih menarik, kita bisa lakukan pengaturan terhadap beberapa atribut tag marquee. Atribut-atribut yang dimaksud diantaranya:

  1. Behavior , yaitu atribut untuk mengatur perilaku tulisan. Nilainya adalah:
    • Scroll : teks/tulisan akan berjalan berulang kali. Maksudnya adalah setelah berjalan 1 kali, maka akan muncul kembali untuk berjalan lagi.
    • Slide : teks/tulisan akan berjalan hanya 1 kali. Setelah itu berhenti.
    • Alternate : teks/tulisan akan berjalan bolak balik, setelah dari kiri ke kanan kemudian berbalik dari kanan ke kiri (atau sebaliknya).
    Contoh :
    <marquee behavior="alternate">TEXT HERE</marquee>
    Maka hasilnya menjadi:
    TEXT HERE
  2. Direction, merupakan atribut yang mengatur arah gerak tulisan. Nilainya adalah:
    • Right: agar tulisan berjalan ke kanan
    • Left: agar tulisan berjalan ke kiri
    • Down: agar tulisan berjalan ke bawah
    • Up: agar tulisan berjalan ke atas.
    Contoh:
    <marquee behavior="scroll" direction="right">TEXT HERE</marquee>
    Maka hasilnya menjadi:
    TEXT HERE
  3. Scrollamount, merupakan atribut yang mengatur kecepatan tulisan berjalan. Nilanya berupa angka. Semakin besar angkanya, maka kecepatannya akan semakin besar pula.
    Contoh :
    <marquee behavior="alternate" direction="right" scrollamount="30">TEXT HERE</marquee>
    Maka hasilnya menjadi:
    TEXT HERE
  4. Onmouseover, merupakan atribut yang mengatur perilaku tulisan jika mouse diletakkan di atasnya. Misalnya kita ingin tulisan akan berhenti jika muse diletakkan diatasnya, maka bentuknya adalah :
    onmouseover="this.stop()"
    Contoh:
    <marquee behavior="alternate" direction="right" scrollamount="30" Onmouseover="this.stop()">TEXT HERE</marquee>
    Maka hasilnya menjadi:
    TEXT HERE
  5. Onmouseout, merupakan atribut yang mengatur perilaku tulisan jika mouse tidak diletakkan di atasnya. Misalnya kita ingin membuat tulisan yang berhenti pada contoh di atas menjadi bergerak kembali, maka bentuknya adalah:
    onmouseout="this.start()"
    Contoh:
    <marquee behavior="alternate" direction="right" scrollamount="30" Onmouseover="this.stop()" onmouseout="this.start()">TEXT HERE</marquee>
    Maka hasilnya menjadi:
    TEXT HERE
Selain atribut-atribut utama di atas, sebenarnya masih banyak lagi atribut untuk marquee. Pembaca mungkin bisa melihatnya dengan menggunakan Macromedia Dreamweaver. Atribut-atribut untuk tag marquee lainnya bisa berupa atribut tag HTML biasa, sepertu style, width, height, align, dan lain sebagainya.
Contoh:
<marquee behavior="alternate" direction="right" scrollamount="30" bgcolor="#0000FF" width="50%">TEXT HERE</marquee>
Maka hasilnya menjadi:
TEXT HERE

0 comments:

Post a Comment