Cara Pasang Awan Bergulir Backgorund Dengan CSS

Awan bergulir backgorund dengan css Selamat sore sobat blogger gimana kabar nih moga sobat semua sehat selalu, pada kesempatan kali ini hasbihtcblog akan berbagi tips cara memasang Latar Posting Awan Bergulir dengan Penggunaan Its Java Script Sederhana Anda Bisa melihat awan Sky Beberapa kali adalah Sangat beautyfull dan sangat cantik diamana awan ini akan bergerak kesana kemari layaknya kita sedang berada dialam bebas, nah buat sobat blogger hasbihtc yang kepengen memanjakan pengunjung blognya dengan memasang awan bergulir baiklah lansung saja kepada pokok permasalahan yuk ikuti langkah dibawah ini :

Latar Awan Bergulir


Latar Belakang Awan Bergulir

Pasang Awan Bergulir backgorund Dengan CSS


Oh yach sebelum sobat memasang Background awan bergulir sobat bisa melihat demonya disini DEMO AWAN BERGULIR gimana setelah melihat demonya keren gak ^-^ sekarang saatnya sobat Membuatnya jika sobat tertarik:
1. Buka Akun Blogger sobat
2. Klik Kiri Nav Template Opsi Manu
3. Klik EDIT HTML.
4. klik "Expand widget"
5. Cari Kode Berikut: </head>
6. Lalu Tambahkan Kode bawah Sebelum kode </head>

<script src="http://dl.dropbox.com/u/69069044/Wes_mob_Post.js" type="text/javascript">
</script>
<script type="text/javascript">

// speed in milliseconds
var scrollSpeed = 70;

// set the default position
var current = 0;

// set the direction
var direction = 'h';

function bgscroll(){

// 1 pixel row at a time
current -= 1;

// move the background with backgrond-position css properties
$('div.clouds').css("backgroundPosition", (direction == 'h') ? current+"px 0" : "0 " + current+"px");

}

//Calls the scrolling function repeatedly
setInterval("bgscroll()", scrollSpeed);

</script>
<style type="text/css">
body{background:#fff}.clouds{background:#3e83c8 url(http://dl.dropbox.com/u/69069044/bg_clouds.png) repeat 0 bottom;width:600px;height:900px;margin:10px;border:2px solid #ccc;}
</style>

7. Simpan template
Cara mengunakannya sekarang sobat membuat sebuah posting dengan Posting HTML
tempatkan kode ini diawal postingan sobat <div class="clouds"> Dan terakhir letakkan kode berikut ini diakhir postingan </div>
8.Publish Post Anda dan saksikanlah Awan Bergulir yang sangat indah

Demikianlah tips dari saya mengenai Cara Pasang Awan Bergulir backgorund Dengan CSS Semoga dapat bermanfaat happy bloging.

0 komentar:

Posting Komentar