header

Free Domain

Membuat Text Lebih Menarik Dengan Marquee Text

|

Membuat Text Lebih Menarik Dengan Marquee Text

Jika pada postingan sebelumnya saya menuliskan tentang bagaimana "Membuat Blinking Text (Text Berkedip) di Blog", kali ini saya akan menulis tentang cara lain yang dapat digunakan untuk membuat text lebih lebih kelihatan menarik dengan membuat 'Text Berjalan" (Marquee Text). Ada beberapa cara macam model marque text, berikut akan coba saya jelaskan beberapa diantaranya ;
Marquee text biasa. Contoh ; kode tag html yang ditulis

http://tutorial7.blogspot.com

ganti 'http://tutorial7.blogspot.com' dengan text anda, maka hasilnya akan seperti ini ;
http://tutorial7.blogspot.com

Jika ingin membuat text tebal, cetak miring, dan dengan garis bawah text tuliskan kodenya seperti ini ;

http://tutorial7.blogspot.com

Hasilnya akan seperti ini ;

http://tutorial7.blogspot.com


Jika masih kurang puas, ingin merubah arah text ataupun ingin menambahkan warna bachground text ikuti cara berikut ini ;
Untuk merubah arah text, tambahkan kode berikut ini ==> direction="tentukan arah text pilihan ana". Ganti text "tentukan arah text pilihan anda" dengan 'left, right, up, down, atau alternate'. 'left' mengarahkan text ke kiri, 'right' ke kanan, 'up' ke atas', 'down' ke bawah, 'alternate' bolak balik kayak orang bingung he..he..! Atau jika ingin efek geraknya hanya satu kali setelah itu berhenti, tambahkan kode ini ==> behavior="slide" <==. Lihat kode dan contohnya di bawah. Saya akan coba membuat marquee text dengan ketentuan text mengarah ke kanan, background warna kuning, teks warna merah, tetapi efek teks miring saya hilangkan sehingga penulisan kodenya ;

http://tutorial7.blogspot.com
'bgcolor' (warna background) saya pilih warna kuning, bisa anda tuliskan dengan kode warna
seperti contoh di atas '#ffff00', atau cukup dengan menuliskan 'yellow', begitu juga dengan warna teksnya, hasilnya sama saja. Text yang muncul jadinya seperti ini ;


http://tutorial7.blogspot.com



Merubah arah teks ke atas atau ke bawah, caranya sama seperti di atas. Tetapi barangkali anda ingin menyesuaikan ukuran tingginya, Maka tambahkan kode ini ==> height="100" <== artinya mempunyai tinggi 100px (pixel). Contoh penulisannya ;http://tutorial7.blogspot.com
Hasilnya akan seperti ini ;
http://tutorial7.blogspot.com




Hasil di atas dilihat sepertinya kurang rapi, anda dapat merapikannya dengan merubah menentukan lebarnya. Seperti ini penulisan kodenya (lebar saya rubah menjadi 270px) ;

http://tutorial7.blogspot.com

Hasilnya seperti ini ;

http://tutorial7.blogspot.com




Sedangkan penambahan kode ==> behaviour="slide" <== efek geraknya hanya satu kali, contoh penulisannya seperti ini ; width="270">http://tutorial7.blogspot.com Hasilnya seperti ini ; http://tutorial7.blogspot.com
Kalau efek bolak balik (kayak orang bingung) contoh penulisannya seperti ini (isikan 'behavior' dengan 'alternate') ; http://tutorial7.blogspot.com Hasilnya akan kelihatan seperti ini ; http://tutorial7.blogspot.com
Bagaimana jika ingin menambahkan url link pada text? Lihat penambahan kodenya di bawah ; http://tutorial7.blogspot.com Lihat hasilnya ; http://tutorial7.blogspot.com Sulit sekali klik linknya jika bergerak terus, bagaimana caranya supaya apabila mouse diarahkan ke link teksnya berhenti. Tambahkan kode ini ==> OnMouseOver="this.stop()" OnMouseOut="this.start()" <== Lihat di bawah ; http://tutorial7.blogspot.com Hasilnya seperti di bawah ; http://tutorial7.blogspot.com OK. Jika link yang mau dibuat lebih dari satu, begini penulisan kodenya ; http://tutorial.blogspot.com http://tutorial.blogspot.com http://tutorial.blogspot.com Hasilnya seperti ini ; http://tutorial.blogspot.com http://tutorial.blogspot.com http://tutorial.blogspot.com Bisakah marquee digunakan untuk image (gambar)? Bisa, tulis kodenya seperti di bawah ; Have A Nice Day Hasilnya akan seperti ini ; Have A Nice Day Sekarang tinggal bagaimana cara menyesuaikan kecepatan scroll nya, lihat penulisan kode di bawah ; lambatLebih CepatLebih Cepat Lagi Hasilnyaseperti ini ; lambatLebih CepatLebih Cepat Lagi Seberapa cepat scroll amount nya terserah anda, tinggal rubah saja nilai (value) 'scrollamount' nya. Semakin banyak semakin cepat.

0 komentar: