Baik sobat BM7 semua, pada kesempatan kali ini akan coba membahas mengenai Cara Membuat Navigasi Back To Top Jquery pada Blog. Fungsi Navigasi Back To Top ini adalah untuk menggulung layar ke atas pada Blog/Situs sobat.
Berikut adalah langkah-langkah Cara Membuat Navigasi Back To Top Jquery pada Blog :
1. Log in di Blogger.com
2. Pada Setting/ Rancangan pilih Edit HTML
3. Carilah kode ]]></b:skin> (Untuk mempercepat pencarian gunakan ctrl+F)
Copy kode dibawah ini, letakkan sebelum kode ]]></b:skin>
#backtotop {
width:100px; /* Mengubah Lebar Box*/
background:#F4FFBF; /* Mengubah warna background box*/
border:1px solid #ccc; /* Mengubah Border Style*/
text-align:center;
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
color:#666; /* Mengubah warna text*/
text-decoration:none;
}
4. Cari kode </body>
Copy kode dibawah ini, letakkan sebelum kode </body>
<a href="#" id="backtotop">Back to top</a>
5. Kemudian terakhir cari kode <head>
Copy kode dibawah ini, letakkan setelah kode <head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'
type='text/javascript'></script>
<script language="javascript">
$(window).ready(function(){
$('#backtotop').click(function(e){
e.preventDefault();
$('html, body').animate({scrollTop:0}, 'slow');
});
});
</script>
Ok sobat BM7, saya cukupkan sampai disini dulu postingan mengenai Cara Membuat Navigasi Back To Top Jquery pada Blog kali ini. Semoga bermanfaat.
0 komentar:
Posting Komentar