[ojegjogja] Cara membuat dan memasang efek marquee atau teks berjalan (komplit)

Contoh 1 :
Kode HTML untuk membuat teks berjalan dari arah kanan ke kiri dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span  style="font-family:arial; font-size: 14px; font-weight:bold;  color:#FFFF00;"><marquee direction="left" scrollamount="2"  height="20px" width="100%" bgcolor="#0000ff" >Teks berjalan dari  kanan ke kiri</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari kanan ke kiri

Contoh 2 :
Kode HTML untuk membuat teks berjalan dari arah kiri ke kanan dengan huruf verdana, bold, warna biru, ukuran huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud kuning adalah sebagai berikut :

<span style="font-family:verdana; font-size: 14px; font-weight:bold;  color:#0000ff;"><marquee direction="right" scrollamount="2"  height="20px" width="100%" bgcolor="#ffff00">Teks berjalan dari kiri ke kanan</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari kiri ke kanan

Contoh 3 :
Kode HTML untuk membuat teks berjalan bolak-balik dari kanan ke kiri dengan huruf verdana, bold, warna kuning, ukuran huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span style="color:#ffff00; font-family: verdana; font-size: 14px;  font-weight: bold;"><marquee bgcolor="#0000ff"  behavior="alternate" height="20px" scrollamount="2" width="100%">Teks  berjalan bolak-balik dari kanan ke kiri</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan bolak-balik dari kanan ke kiri

Contoh 4 :
Kode HTML untuk membuat teks berjalan dari atas ke bawah huruf arial, bold, warna biru, ukuran huruf 14px, tinggi area 70px, lebar area 100% di atas backgroud kuning adalah sebagai berikut :

<span style="color:#0000ff; font-family: arial; font-size: 14px; font-weight:  bold; text-align:center;"><marquee bgcolor="#ffff00"  direction="down" height="70px" scrollamount="1" width="100%">Teks  berjalan dari atas ke bawah</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari atas ke bawah

Contoh 5 :
Kode HTML untuk membuat teks berjalan dari bawah ke atas dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 70px, lebar area 100% di atas backgroud merah adalah sebagai berikut :

<span style="color:#ffff00; font-family: arial; font-size: 14px; font-weight:  bold; text-align:center;"><marquee bgcolor="#ff0000" direction="up" height="70px"  scrollamount="1" width="100%">Teks berjalan dari bawah ke  atas</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari bawah ke atas

Contoh 6 :
Kode HTML untuk membuat teks berjalan bolak-balik dari atas ke bawah huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 70px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span style="color:#ffff00; font-family: arial; font-size: 14px; font-weight:  bold; "><marquee bgcolor="#0000ff" behavior="alternate"  direction="up" height="70px" scrollamount="2" width="100%">Teks  berjalan berulang dari atas ke bawah</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan berulang dari atas ke bawah

Contoh 7 :
Kode HTML untuk membuat teks berjalan dari bawah ke atas satu kali setelah itu berhenti dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 70px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span style="color:#ffff00; font-family: arial; font-size: 14px; font-weight:  bold; "><marquee bgcolor="#0000ff" behavior="slide" direction="up"  height="70px" scrollamount="3" width="100%">Teks berjalan dari bawah ke atas lalu berhenti</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari bawah ke atas lalu berhenti

Contoh 8 :
Kode HTML untuk membuat teks berjalan dari kanan ke kiri satu kali setelah itu berhenti dengan; huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span style="color:#ffff00; font-family: arial; font-size: 14px; font-weight:  bold;"><marquee bgcolor="#0000ff" behavior="slide"  direction="left" height="20px" scrollamount="3" width="100%">Teks  berjalan dari kanan ke kiri lalu berhenti</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari kanan ke kiri lalu berhenti

Contoh 9 :
Kode HTML untuk membuat teks memantul berulang-ulang dari kanan ke kiri dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span style="color:#ffff00; font-family: arial; font-size: 14px; font-weight:  bold; "><marquee scrolldelay="10" behavior="alternate"  direction="up" width="100%" scrollamount="2" height="70px"  bgcolor="#0000ff"><marquee scrolldelay="10" behavior="alternate"  direction="left" scrollamount="2">Teks memantul  berulang-ulang</marquee>< /marquee></span>

Hasilnya seperti di bawah :
Teks memantul berulang-ulang

Contoh 10 :
Kode HTML untuk membuat teks berjalan dari arah kanan ke kiri dan akan berhenti setelah mouse didekatkan, dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :

<span style="color: yellow; font-family: arial; font-size: 14px; font-weight: bold;"><marquee behavior="scroll" bgcolor="#0000ff" direction="left" height="20px" onmouseout="start()" onmouseover="stop()" scrollamount="2" width="100%">Teks berjalan dari kanan ke kiri dan akan berhenti setelah mouse didekatkan</marquee></span>

Hasilnya seperti di bawah :
Teks berjalan dari kanan ke kiri dan akan berhenti setelah mouse didekatkan.

Contoh 11 :
Kode HTML untuk membuat teks link dimana teks tersebut berjalan dari bawah ke atas dan akan berhenti setelah mouse didekatkan. Jika link tersebut di-click, maka halaman yang bersangkutan akan terbuka adalah sebagai berikut :

<span style="color:#ffff00; font-family: arial; font-size: 14px; font-weight:  bold; "><marquee  onmouseover="this.stop()" onmouseout="this.start()" bgcolor="#ffff00"  scrollamount="2" direction="up" width="100%" height="100"  align="left"><a  href="http://www.linksukses.com/2010/01/cara-membuat-textarea.html">Cara  membuat Texarea</a> 

<a  href="http://www.linksukses.com/2010/01/penggunaan-id-dan-class.html">Penggunaan  ID dan CLASS</a> 

<a  href="http://www.linksukses.com/2010/02/syntax-highlighter-untuk-blogger.html"> Syntax  Highlighter untuk Blogger</a> 

<a  href="http://www.linksukses.com/2010/02/efek-kertas-lipat.html">Efek  Kertas Lipat</a> 

<a  href="http://www.linksukses.com/2010/01/efek-bayangan-dengan-photoshop.html">Efek  bayangan</a> 

</marquee></span>