Dengan fungsi smooth scrolling,maka blog anda akan semakin kelihatan prof layaknya situs situs yang sudah ternama.
Kamu tertarik?.......ikuti lagkah langkahnya berikut:
Cara pemasangan smooth scrolling untuk template blog blogger
Pertama,masuk kedalam edit HTML template blogspot kamu lalu paste code CSS berikut sebelum tag ]]</b:skin>
#go-to-top {
padding:1px;
position:fixed;
bottom:0px;right:0px;
cursor:pointer;
}
#go-to-top img
{
height:40px;
width:35px;
border:none;
padding-right:5px;
}
Kemudian pastekan javascriptnya berikut sebelum tag </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js' type='text/javascript'></script>
<script language='javascript' type='text/javascript'>
$(document).ready(function(){
// hide
$("#go-to-top").hide();
// fade in
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('#go-to-top').fadeIn();
} else {
$('#go-to-top').fadeOut();
}
});
// scroll to top
$('#go-to-top img').click(function () {
$('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
});
});
</script>
Catatan: jika code
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js' type='text/javascript'></script>
sudah ada pada template kamu,maka tak perlu dipakai.Masih pada edit HTML,sekarang temukan tag </body> dan pastekan code berikut ini sebelum </body>
<a href='#' id='go-to-top'><img alt='Back to Top' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaDVZ0EMSlDibRQlBUkW0-loi-CICRMb8PS6ufOa3FhVQU6FQoMUjpWL-rYj4JkFIF6ad_w-aMivcqwgURV1bv3VYU0x0biLZxoG_pRismtj5SOtNHr2mjyknI5GYFOqOP8EP5M-0d04iJ/'/></a>
Simpan template kamu!
Tidak ada komentar:
Posting Komentar