Excalibur
Info

Selamat Datang

Selamat Datang Di Blog Roy Lichtenstein- Saya Senang Anda Berada Di Sini, Dan Berharap Anda Sering Datang Kembali. Silakan Berlama - Lama Di Sini Dan Membaca Lebih Lanjut Tentang Artikel Yang Saya Susun. Ada Banyak Hal Dapat Anda Pelajari, Anda Mungkin Akan Menemukan Sesuatu Yang Menarik

Sekilas Tentang Roy

Nama saya Roy Lichtenstein, Saya Bukan Seorang Blogger, Hacker, Desainer Atau Apapun Tapi Saya Hanya Seseorang Yang Ingin Selalu Belajar Dan Ingin Tau Sesuatu Yang Baru...

Social Icons

xtreme8-andinova.blogspot.com

Cara Membuat Kotak Scroll Pada Blog

Untuk menghemat ruang pada blog anda, terutama pada sidebar atau pun halaman postingan sekalipun, anda dapat menempatkan suatu script atau tulisan yang panjang kedalam kotak scroll agar terlihat ringkas dan simple. Di bawah ini saya menawarkan kotak scroll 4 versi, yaitu kotak scroll dengan latar belakang transparans, kotak scroll dengan latar belakang berwarna, Kotak Scroll dengan latar belakang Gambar dan kotak scrol Horizontal. Silahkan anda pilih sesuai dengan keinginan anda.


Berikut adalah kode script kotak scroll:

Kotak Scroll Dengan Latar Belakang Transparans.

Isi Kotak scroll anda di sini sesuai dengan keinginan anda dan anda dapat merubah lebar dan tinggi kotak scroll sesuai dengan keinginan anda serta besar font juga bisa anda rubah, pkoknya sesuaikan dengan tempat anda memasang kotak scroll.
Kodenya:
<div style="height:120px;width:250px;font:16px/26px Georgia, Garamond, Serif;overflow:scroll;">
Isi Kotak scroll anda di sini sesuai dengan keinginan anda.
</div>

Kotak Scroll Dengan Latar Belakang Berwarna:

Isi Kotak scroll anda di sini sesuai dengan keinginan anda dan anda dapat merubah lebar dan tinggi kotak scroll sesuai dengan keinginan anda serta besar font juga bisa anda rubah, pkoknya sesuaikan dengan tempat anda memasang kotak scroll.
Kodenya:
<div style="height:90px;width:160px;overflow:scroll;background-color:#67F152;">Isi Kotak scroll anda di sini sesuai dengan keinginan anda 'background-color' property.</div>

Kotak Scroll Dengan Latar Belakang Gambar:

Anda bisa menggantikan kode gambar latar belakang dan besar font sesuai keinginan anda serta warna tulisan silahkan anda atur supaya tulisan tampak jelas terlihat di atas gambar.
Kodenya:
<div style="height:220px;width:325px;overflow:scroll;font:35px/45px cursive;color:#A6120D;background:url('http://i516.photobucket.com/albums/u323/natural_pics/milford_sound.jpg');">Anda bisa menggantikan kode gambar latar belakang dan besar font sesuai keinginan anda serta warna tulisan silahkan anda atur supaya tulisan tampak jelas terlihat di atas gambar.
</div>

Kotak Scroll Horizontal:

Isi Kotak scroll anda di sini sesuai dengan keinginan anda dan anda dapat merubah lebar dan tinggi kotak scroll sesuai dengan keinginan anda serta besar font juga bisa anda rubah, pkoknya sesuaikan dengan tempat anda memasang kotak scroll.
Kodenya:
<div style="border:1px solid black;width:200px;height:100px;overflow-y:hidden;overflow-x:scroll;">
<p style="width:250%;">
Isi Kotak scroll anda di sini sesuai dengan keinginan anda.
</p>
</div>

Keterangan: Teks Dan Gambar serta lebar dan tinggi pada kotak scroll bisa anda rubah sesuai dengan keinginan anda.

No comments:

Post a Comment