Membuat Teks Berjalan (MARQUEE TAG)

Depresi Jurnalis - Pada kesempatan kali ini admin akan membagikan cara membuat teks berjalan, seperti biasa mungkin artikel ini sudah banyak dibahas dikalangan blog-blog master namun bagi anda yang masih pemula ini bisa jadi akan sangat menyenangkan karena memungkinkan web atau blog tidak terlihat terlalu statis. MARQUEE TAG adalah salah satu tag HTML yang berfungsi untuk membuat object menjadi bergerak ke kanan, kiri, atas, bawah dan masih banyak lagi.

Berikut akan dijelaskan Attribute, Value beserta Description yang ada pada Marquee Tag.

AttributeValueDescription
direction up, down, left, rightUntuk mengatur kearah mana teks atau konten akan berjalan. Jika tidak ada value yang ditentukan nilai defautnya adalah left
width px atau %Mengatur lebar konten dari marquee.
heightpx atau %Mengatur tinggi konten dari marquee.
bgcolornama warna (red, blue, dst) atau kode warna hexadimal.Memberi background konten dari marquee.
behavior scroll, slide, alternate Mengatur variasi berjalannya teks atau object dalam marquee.
scrollamount angka Mengatur kecepatan dari berjalannya teks atau object. Nilai defaultnya adalah 6.
scrolldelaysecondsMengatur jeda atau perhentian sejenak.
align left, center, right, justifyMengatur posisi teks atau konten pada marquee
onmouseoverthis.stop()Menghentikan teks yang berjalan saat disorot mouse
onmouseoutthis.start()Memulai kembali teks yang berjalan ketika mouse keluar dari area marquee.
hspacepx atau %Mengatur jarak spasi kanan kirinya konten
vspacepx atau %Mengatur jarak atas bawahnya konten
loopangkaMenetapkan berapa kali marquee akan bergulir. Jika tidak ada value yang ditentukan, nilai defaultnya adalah -1, yang berarti marquee akan bergulir terus menerus.


Berikut akan admin berikan beberapa contoh dari penggunaan marquee tag tersebut.
  1. Secara default maquee tag tanpa atribute akan seperti ini
    <marquee>Marquee Default</marquee>

    Marquee Default
  2. Marquee tag dengan atribut direction
    <marquee direction="up">marquee direction="up"</marquee>
    <marquee direction="right">marquee direction="right"</marquee>
    <marquee direction="down">marquee direction="down"</marquee>
    <marquee direction="left">marquee direction="left"</marquee>

    marquee direction="up"

    marquee direction="right"

    marquee direction="down"

    marquee direction="left"
  3. Marquee tag dengan atribut behavior
    <marquee behavior="alternate">marquee behavior="alternate"</marquee>
    <marquee behavior="scroll">marquee behavior="scroll"</marquee>
    <marquee behavior="slide">marquee behavior="slide"</marquee>

    marquee behavior="alternate"

    marquee behavior="scroll"

    marquee behavior="slide"
  4. Marquee tag dengan dengan atribut scrolldelay
    <marquee scrolldelay="100">marquee scrolldelay="100"</marquee>
    <marquee scrolldelay="200">marquee scrolldelay="200"</marquee>
    <marquee scrolldelay="300">marquee scrolldelay="300"</marquee>

    marquee scrolldelay="100"

    marquee scrolldelay="200"

    marquee scrolldelay="300"
  5. Marquee tag dengan atribut scrollamount
    <marquee scrollamount="10">marquee scrollamount="10"</marquee>
    <marquee scrollamount="20">marquee scrollamount="20"</marquee>
    <marquee scrollamount="30">marquee scrollamount="30"</marquee>

    marquee scrollamount="10"

    marquee scrollamount="20"

    marquee scrollamount="30"
  6. Marquee tag degan atribut width
    <marquee width="75%">marquee width="75%"</marquee>
    <marquee width="30%">marquee width="30%"</marquee>

    marquee width="75%"

    marquee width="30%"
  7. Marquee tag dengan atribut height
    <marquee height="75px">marquee height="75px"</marquee>
    <marquee height="50px">marquee height="50px"</marquee>

    marquee height="75px"

    marquee height="30px"
  8. Marquee tag dengan atribut bgcolor
    <marquee bgcolor="red">marquee bgcolor="red"</marquee>
    <marquee bgcolor="#ddd">marquee bgcolor="#ddd"</marquee>

    marquee bgcolor="red"
    marquee bgcolor="#ddd"
  9. Marquee tag dengan atribut hspace atau vspace
    <marquee hspace="100px">marquee hspace="100px"</marquee>
    <marquee vspace="50px">marquee vspace="50px"</marquee>

    marquee hspace="100px"

    marquee vspace="100px"
  10. Marquee tag dengan style
    <p style="background: #366;text-align:center;padding:4px;font-size:160%;color:#0fc;">
    <marquee direction="left" scrollamount="5" width="40%"><<< 12345</marquee>
    <marquee direction="right" scrollamount="5" width="40%">12345 >>></marquee>

    <<< 123456789 987654321 >>>
  11. Marquee dengan atribut onmouseover  dan onmouseout
    <marquee onmouseover="this.stop()" onmouseout="this.start()">arahkan mouse pada teks maka akan berhenti</marquee>
    Arahkan kursor ke teks maka teks akan berhenti, dan jika kursor keluar dari area teks maka akan mulai berjalan kembali
    arahkan mouse pada teks maka akan berhenti
  12. Marquee tag dengan gambar
    <marquee><img src="URL GAMBAR KAMU" /></marquee>
Bagaimana sobat menarik bukan penggunaan tag html yang satu ini, selebihnya bisa kalian kreasikan sendiri, selamat mencoba dan semoga berhasil.
Terima kasih. Salam Satu Inspirasi.

Sumber Referensi :
http://mas-muzt.blogspot.co.id/2014/04/tag-marquue-dan-atributnya.html
https://internet-teknologi-informasi.blogspot.co.id/2017/02/membuat-teks-berjalan-dengan-tag-marquee.html
https://developer.mozilla.org/id/docs/Web/HTML/Element/marquee

Sumber Gambar :
Google Images

0 Response to "Membuat Teks Berjalan (MARQUEE TAG)"

Posting Komentar

Berkomentarlah dengan bijak, relevan dan sesuai dengan pokok pembahasan. Thanks by Admin Ganteng 😎

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel