0 Cara membuat Scroll to Top pada Blog Jquery

Cara Membuat Back To Top Dengan Jquery - Banyak banget blog yang harus saya urusi,jadi saya agak kewalahan dengan Posting sana sini, saya akan berusaha update blog ini agar terlihat lebih fresh, kalau ada yang mau nulis disini akan saya beri kesempatan, walaupun blog ini sebenarnya sepi pengunjung karena kurangnya SEO dan Blogwallking. Untuk kali ini saya akan share ajja, Cara Membuat Back To Top Dengan Jquery pada Blogspot. untuk langkahnya Anda bisa Lihat disini

Login Ke Blogger
MAsuk ke Rancangan --> Tata Letak --> Add Widget --> Html/Javascript.
Kemudian masukkan kode berikut :

<style type="text/css">
#scrolltotop a
{
display: block;
display: none;
z-index: 999;
opacity: .6;
position: fixed;
top: 100%;
margin-top: -20px;
left: 50%;
margin-left: -150px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
width: 68px;
line-height: 1px;
height: 15px;
padding: 10px 3px;
background-color: #000;
font-size: 12px;
font-weight: bold;
text-align: left;
color: #fff;
}
</style>
<div id="scrolltotop"><a href="#">Scroll to top</a></div>



<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var scroll_timer;
var displayed = false;
var $scrolltotop = $('#scrolltotop a');
var $window = $(window);
var top = $(document.body).children(0).position().top;
$window.scroll(function () {
window.clearTimeout(scroll_timer);
scroll_timer = window.setTimeout(function () {
if($window.scrollTop() <= top)
{
displayed = false;
$scrolltotop.fadeOut(500);
}
else if(displayed == false)
{
displayed = true;
$scrolltotop.stop(true, true).show().click(function () { $scrolltotop.fadeOut(500); });
}
}, 100);
});
});
</script>

Ubahlah kode yang saya tandai dengan warna merah sesuai kehendak anda.
Kemudian Save.

Dan lihatlah hasilnya, blog anda akan terlihat bagus dan cantik dengan Back to top Jquery.

Artikel Terkait :