Monday, May 21, 2012

Variasi Teks dan Gambar Berjalan

Blog Tutorial - Variasi teks dan gambar tidak hanya terbatas pada pewarnaan maupun bentuknya saja. Teks dan gambar bisa divariasi menjadi berjalan / bergerak. Perlakuan ini bisa anda pasang di posting blog atau di widget HTML anda. Teks atau gambar berjalan dikenal dengan istilah marquee. Kode HTML dasar untuk marquee adalah sebagai berikut.


<marquee>Teks atau gambar disini akan berjalan</marquee>

Teks warna merah adalah teks atau gambar yang dibuat berjalan.

Nah, untuk lebih manambah variasi teks atau gambar berjalan tersebut anda bisa memasukkan kode-kode variasi di bawah ini di belakang <marquee ...... (masing-masing varian dipisahkan dengan spasi) kemudian tutup dengan >Teks atau gambar</marquee>marquee >

Kode-kode variasi :
  1. align="left/center/right" -- Mengatur posisi text.
  2. bgcolor="kode warna" -- Mengatur warna background / latar belakang teks / gambar.
  3. color="kode warna" -- Mengatur warna teks.  Untuk kode warna bisa dilihat di Daftar Kode Warna (Color Code)
  4. direction="left/right/up/down" -- Arah gerakan teks / gambar.
    • left (berjalan dari kanan ke kiri)
    • right (berjalan dari kiri ke kanan)
    • up (berjalan ke atas)
    • down (berjalan ke bawah)
  5. behavior="scroll/slide/alternate" » Pilihan untuk perilaku gerakan
    • scroll (bergerak berputar)
    • slide (bergerak sekali saja lalu berhenti)
    • alternate (bergerak bolak balik dari kiri ke kanan dan seterusnya)
  6. title="catatan" (Catatan akan muncul ketika mouse berada di atas teks / gambar)
  7. scrollmount="ketik angka" -- Mengatur kecepatan gerakan, semakin besar angka gerakan semakin cepat.
  8. scrolldelay="ketik angka" -- Mengatur waktu delay gerakan dalam milidetik.
  9. loop="angka|-1|infinite" -- Mengatur jumlah loop
  10. width="lebar" -- Mengatur lebar kolom dalam pixel atau persen


Contoh teks berjalan
Kode HTML :

<marquee align="center" direction="left" height="20" scrollamount="2" width="100%"> Teks berjalan dari kanan ke kiri </marquee> 


Hasil variasi dengan kode di atas adalah :

Teks berjalan dari kanan ke kiri

Untuk arah gerakan dan kecepatan bisa anda ganti teks yang berwarna merah pada direction dan scrollamount pada kode di atas.

Untuk gambar, tinggal anda ganti saja Teks dengan alamat URL dimana gambar diambil
Contoh gambar berjalan
Kode HTML :

<marquee align="center" direction="left" height="50" scrollamount="3" width="100%"> <div class="separator" style="clear: both; text-align: center;">
<a href="http://www.blogger.com/bloggtutorial4u.blogspot.com"><img border="0" height="98" src="http://1.bp.blogspot.com/-RrtbL_rNzLg/T7jFph3gQDI/AAAAAAAAA54/nLQymwfJZpc/s200/Left%2BArrow%2B2.jpg" width="200" /></a></div>


Catatan: Ganti kode teks berwarna merah dengan alamat URL dimana gambar anda ambil.
Oke, selamat mencoba dengan berbagai variasi di atas.

Hasil variasi gambar berjalan





Untuk berlatih variasi kombinasi marquee bisa ditengok juga Disini, Klik Saja.


Selamat berkreasi
Amru.S.- Admin Blog Tutorial

Baca Juga » Info Kontes - Kompetisi Tingkat Nasional-International


1 komentar:

Umar Sensai said...

wow Mas Keren hehe.. aku udah Jadi member Mas .. Yang Umar-sensai, Bisa follow balik Blog saya gak mas heheh..

Follow Us

Daftar Artikel

Created by. Amru Sholihin. Powered by Blogger.

TIPS SEO HARI INI

Anda punya Blog? Atau website ingin meningkatkan Page Rank di Search Engine? Klik logo-logo di bawah ini untuk melihat caranya :
ping fast  my blog, website, or RSS feed for Free Ping your blog, website, or RSS feed for Free My Ping in TotalPing.com

PageRank Display

PageRank