Sepertinya Pemblokir Iklan Anda Aktif
Maaf, Sayangnya blog ini tidak bisa hidup tanpa bantuan dari iklan.
Mohon nonaktifkan terlebih dahulu Pemblokir iklan (misal: Adblock) khusus untuk blog ini.
Setelah Anda menonaktifkan AdBlock, silahkan reload halaman ini.
Terima Kasih, semoga anda selalu dimudahkan pada setiap usaha, serta semoga Tuhan menambah kualitas kesehatan anda sekeluarga.

Jabat tangan
FaRo.

Seperti yang anda lihat di halaman blogger ini, backgroundnya menggunakan  parallax scrolling effect, parallax adalah effect dimana background bergerak sesuai dengan yang kita atur saat page discroll, aturan itu bisa saja berupa pelambatan gerak, perubahan arah dan lain - lain, ok untuk menggunakan parallax scrolling effect untuk blogger yang sederhana (seperti background blog ini) yaitu :
1. deklarasikan sebuah library jquery dibagian head, sebelum tag </head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
2. Masukkan sebuah html seperti berikut setelah tag <body>
<div class="bgWrapper"></div>
3. Masukkan kode berikut sebelum tag </b:skin> untuk memasang background
.bgWrapper{
 position:fixed;
 background:url(http://your-url-image.jpg.png) top center; 
 height:100%; 
 width:100%; 
 top:0; 
 left:0;
 z-index:-1;
} 
ganti url image sesuai yang anda inginkan.

4. Masukkan javascript berikut sebelum tag </body>
<script type='text/javascript'> 
$(document).ready(function(){
 $(window).bind('scroll',function(e){
     parallaxScroll();
    });
 
    function parallaxScroll(){
     var scrolledY = $(window).scrollTop();$('.bgWrapper').css('background-position','center -'+((scrolledY*0.2))+'px');
    }
 }); </script>
0.2 maksudnya adalah kecepatan gerak background, default adalah 1.

5. selesai, dengan kreatifitas serta trial and error, anda akan bisa membuat tidak hanya parallax effect seperti di blog ini melainkan juga yang lebih kompleks.

Semoga Artikel Ini bermanfaat.
Tautan sumber dan referensi : http://blog.fraser-hart.co.uk/jquery-parallax-scrolling/

Post link : http://www.blognafaro.com/2013/10/membuat-parallax-scrolling-effect-sederhana-untuk-blogger.html

Membuat Parallax Scrolling Effect Sederhana Untuk Blogger

Ringkasan : di halaman blogger ini, backgroundnya menggunakan parallax scrolling effect , parallax adalah effect dimana background bergerak sesuai dengan yang kita atur saat halaaman discroll .
Jumlah Kata : | Dipublikasikan pada Wednesday, October 16, 2013
 
Top