Silahkan Klik...!!!

Kamis, 24 Maret 2011

Tag Marquee dan Atributnya

Marquee adalah tag HTML yang berguna untuk membuat tampilan yang bergerak vertical atau horizontal. Dengan menggunakan tag Marquee ini kamu dapat menghasilkan suatu tampilan yang cukup interaktif dikarenakan tag ini menghasilkan tampilan yang bergerak sehingga akan sangat menarik perhatian para pengunjung. Tag ini akan sangat baik bila digunakan untuk menampilkan suatu pengumuman-pengumuman pendek seperti yang kita lihat di televisi. Penggunaannya cukup simple cukup gunakan tag berikut :

<marquee> Isi yang ingin kamu tampilkan taruh disini </marquee>


kalian bisa melihat hasilnya setelah mengetik listing tersebut


Yang dapat digerakkan bukan hanya teks tapi gambar atau bahkan video pun juga bisa menggunakan tag Marquee ini :

<marquee> ini adalah logo semogaberkah.com <img src="http://semogaberkah.com/logo.jpg"> </marquee>


Kalian bisa liat hasil setelah dengan mengetik listing di atas...


WIDTH and HEIGHT
Atribut ini digunakan untuk menentukan ukuran dari tampilan untuk tag MARQUEE
Contoh :



<marquee width=200 height=50> semogaberkah.blogspot.com </marquee>
<marquee width=500 height=200> semogaberkah.blogspot.com </marquee>


Silahkan ketik listingnya dan liatlah hasilnya....


DIRECTION
Atribut ini digunakan untuk menentukan arah gerak dari tampilan apakah ingin ke kiri, kanan, atas, atau bawah.
Contoh :



  1. <marquee direction=left> semogaberkah.blogspot.com </marquee>  
  2. <marquee direction=right> semogaberkah.blogspot.com </marquee>  
  3. <marquee direction=up> semogaberkah.blogspot.com </marquee>  
  4. <marquee direction=down> semogaberkah.blogspot.com </marquee>



Kalian dapat mencoba atribut-atribut diatas dan lihatkan hasilnya..


BEHAVIOUR
Atribut ini digunakan untuk menentukan bagaimana tampilan bergerak, jika sebelumnya yang ditentukan adalah arahnya maka pada atribut BEHAVIOUR yang ditentukan adalah perilaku geraknya.
Contoh :
BEHAVIOR = SCROLL
Dengan penentuan BEHAVIOR = SCROLL maka tampilan akan bergerak sesuai arah yang ditentukan dan akan kembali mengulangi gerakan dari titik awal gerakan.



<marquee behaviour=scroll> semogaberkah.blogspot.com </marquee>


BEHAVIOR = SLIDE Dengan penentuan BEHAVIOR = SLIDE maka tampilan akan bergerak sesuai arah yang ditentukan lalu kemudian berhenti di titik akhir tanpa mengulangi gerakan sebelumnya.


<marquee behaviour=slide> semogaberkah.blogspot.com </marquee>


BEHAVIOR = ALTERNATE
Dengan penentuan BEHAVIOR = ALTERNATE maka tampilan akan bergerak bolak-balik.



<marquee behaviour=alternate> semogaberkah.blogspot.com </marquee>


Kalian dapat mencoba atribut-atribut diatas dan lihatkan hasilnya..



SCROLL DELAY
Atribut ini digunakan untuk menentukan jeda waktu antara tiap gerakan dari tampilan. Nilai yang diisi untuk atribut ini adalah berupa angka dalam mili detik.
Contoh :
Normal



<marquee> semogaberkah.blogspot.com </marquee>


Delay 500 mili detik


<marquee scrolldelay=500> semogaberkah.blogspot.com </marquee>


Delay 1000 mili detik


<marquee scrolldelay=1000> semogaberkah.blogspot.com </marquee>


Kalian dapat mencoba atribut-atribut diatas dan lihatkan hasilnya..




SCROLL AMOUNT
Meskipun kelihatannya hampir sama dengan atribut sebelumnya SCROLLDELAY, SCROLLAMOUNT memiliki sedikit perbedaan dengan atribut tersebut. Jika SCROLLDELAY berfungsi untuk menentukan jeda waktu antara tiap gerakan, maka atribut SCROLLAMOUNT berfungsi untuk menentukan jauhnya lompatan untuk setiap gerakan. 
Contoh berikut merupakan perbedaan antara marquee normal dengan marquee yang mempunyai nilai SCROLLAMOUNT 20 mili detik dan 70 mili detik:





  1. <marquee> semogaberkah.blogspot.com </marquee>  
  2. <marquee scrollamount=20> semogaberkah.blogspot.com </marquee>  
  3. <marquee scrollamount=70> semogaberkah.blogspot.com </marquee>



Kalian dapat melihat hasilnya seteleh mengetik atribut-atribut diatas....




BGCOLOR
Penggunaan atribut BGCOLOR pada tag MARQUEE akan menghasilkan jalur gerakan memiliki warna. Prinsip kerja atribut ini sama dengan atribut BGCOLOR pada tag TABLE yaitu memberikan warna latar.
Contoh :



<marquee bgcolor=yellow> semogaberkah.blogspot.com </marquee>


Tag diatas akan menghasilkan tulisan bergerak yang memiliki warna latar berwarna kuning.




HSPACE
Atribut ini berguna untuk memberikan jarak antara tampilan bergerak dengan tulisan yang ada disamping kanan dan kiri tulisan.
Contoh :



  1. Halo kawan <marquee width=25bgcolor=yellow>  
  2. semogaberkah.blogspot.com <br />  
  3. Tempat dimana kamu bisa belajar segalanya !!  
  4. </marquee> Halo kawan..



Kode diatas mempunyai nilai HSPACE default yaitu 0 sehingga tidak ada jarak dikiri dan kanan.


Sedangkan kode berikut ini mempunyai nilai HSPACE sebesar 70.


  1. Halo kawan <marquee hspace=70 width=25bgcolor=yellow>  
  2. semogaberkah.blogspot.com <br />  
  3. Tempat dimana kamu bisa belajar segalanya !!  
  4. </marquee> Halo kawan..





VSPACE
Atribut ini berguna untuk memberikan jarak antara tampilan bergerak dengan tulisan yang ada diatas dan dibawah tulisan.
Contoh

  1. Halo kawan <br /><marquee width=25bgcolor=yellow>  
  2. semogaberkah.blogspot.com <br />  
  3. Tempat dimana kamu bisa belajar segalanya !!  
  4. </marquee><br />Halo kawan.. 

Kode diatas mempunyai nilai HSPACE default yaitu 0.

Sedangkan dibawah ini kode untuk memberikan jarak sebesar 50 px diatas dan dibawah marquee.

  1. Halo kawan <br /><marquee vspace=50 width=25bgcolor=yellow>  
  2. semogaberkah.blogspot.com <br />  
  3. Tempat dimana kamu bisa belajar segalanya !!  
  4. </marquee><br />Halo kawan..
 Hasilnya dapat kalian lihat sendiri setelah mencobanya... :)

LOOP
Pengulangan dari tampilan bergerak dengan tag MARQUEE dapat diatur jumlahnya dengan atribut ini. Jika kamu tidak mengatur jumlah pengulangan dengan atribut loop maka secara otomatis akan diartikan bahwa tampilan itu akan bergerak terus menerus tanpa batas.
Contoh penggunaan :

<marquee loop=2> semogaberkah.blogspot.com </marquee>

 Tag diatas mengkombinasikan atribut LOOP dengan atribut BEHAVIOR sehingga akan menghasilkan pengulangan sebanyak empat kali lalu setelah itu teks tersebut akan berhenti pada titik akhir.

2 komentar:

Anonim mengatakan...

Admin, ini artikelnya komplit sekali, ijinkan saya share sebagian untuk melengkapi yang sudah ada, terima kasih, salam sukses.

Muhammad Pascal Rahmadi mengatakan...

Wah Adminnya baik hati sekali berbagi ilmunya tidak setengah setengah, terimakasih min ilmunya bermanfaat sekali

Posting Komentar