Cara membuat gambar melayang

Cara membuat gambar melayang menggunakan properti float, properti float sangat sering digunakan untuk gambar. Dengan Properti float, sebuah gambar bisa dibuat melayang diatas elemen yang lain. Sehingga gambar tetap akan muncul diatas halaman web atau blog kita, walaupun halaman kita scroll keatas ataupun kebawah. Selain itu kita juga dapat mengatur posisi letak gambar, baik dipojok atas, bawah, kanan, ataupun kiri.
Sebagai contoh anda bisa lihat gambar melayang yang ada dipojok kiri bawah pada halaman ini. Bila anda berminat, silahkan anda ikuti langkah - langkah dibawah ini :

1. Login ke blogger dengan ID anda.
2. Klik Rancangan.
3. Dan KLik tab Edit HTML.

4. Jangan lupa Klik tombol "Expand Widget Templates"

5. Cari kode di bawah ini atau yang mirip dengan kode ini :

]]></b:skin>

6. Copy kode di bawah ini dan taruh sebelum kode ]]></b:skin> :

#float_gambarmelayang {<br /> position:fixed;_position:absolute;bottom:0px;left:0px;clip:<br /> inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);}<br />

7. Cari kode di bawah ini atau yang mirip dengan kode ini :

</body>

8. Copy kode di bawah ini dan taruh sebelum kode </body> :

<div id="gambarmelayang">
<a href="http://www.carabuatwebgratis.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4vvweyzyuKnJYB0k4atauE_W2lmO2MDPlpAt-6Oed3i-qKwvH_vBJrCKgpNKujJlKfFJ7HVrZNuR1KpBvUBZmOObtVHwgLRsZfUuAaDmXzjFlDejr0Tbacnn9REgeSXjOQ9wDIFFYzc87/s100/Logo%2Bcara%2Bbuat%2Bweb%2Bgratis.jpg"  border="0" /></a>
</div>

Keterangan :
- Teks warna Orange ganti dengan ULR blog anda.
- Teks warna Ping ganti dengan ULR Gambar anda.
- Teks warna Biru adalah ukurang gambar. (s100 = lebar 100px, tinggi 100px)

9. Simpan Template.

Ok...., Silahkan anda coba dan Semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.
Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Judul: Cara membuat gambar melayang; Ditulis oleh Unknown; Rating Blog: 5 dari 5

Dengan memasukan alamat email dibawah ini, berarti anda akan dapat kiriman artikel terbaru dari Blogger Tutorial | SEO | Free Blogger Templates | OOM RIO.com di inbox anda:

Related Posts

• Cara membuat menu tooltipMenu yang berbentuk vertikal ini sangat menarik untuk dipasang pada web atau blog kita. Selain berfungsi sebagai daftar isi, tepatnya digunakan untuk daftar link at ... readmore
• Thread Comments Stylish dengan CSS Modifikasi Thread Comments Blogger Dengan CSS, ini pernah saya bahas dan kali ini saya akan membagikan yang versi duanya yang lebih stylish yang kebetulan saya ... readmore
• Modifikasi Widget Archive dengan CSSMemodifikasi widget archive dengan css, itulah ayang akan kita bahas sekarang, memang mudah memodifikasi widget archive seperti membuat scroll down, menambahkan bac ... readmore
• Cara membuat gambar memutarFitur CSS memungkinkan kita untuk membuat banyak hal khususnya membuat tampilan halaman web ataupun blog menjadi lebih menarik. Pada waktu yang lalu saya sudah bany ... readmore
• Cara membuat textarea dengan tombol "select all"Belajar kali ini adalah bagaimana kita menggunakan Javascript dan Css untuk menambahkan tombol "select all" pada textarea. Sehingga pengunjung lebih mudah untuk men ... readmore