Membuat Persentase Pada Scrollbar Di Blog

hay sobat blogspot.com! sebelum anda berjalan2 keblog orang lain ada baiknya anda berkeliling di blog saya yang ramah lingkungan ini untuk mempercantik blog sobat dengan PERSENTASE PADA SCROLLBAR 

langsung aja yuk

• buka blogger > template > edit html 
• taruh kode di bawah tepat di atas ]]></b:skin>

 

#scroll {
  display:none;
  position:fixed;
  top:0;
  right:15px;
  z-index:500;
  padding:3px 8px;
  background-color:#369fcf;
  color:#fff;
  border-radius:3px;
  font-size:14px;  
}
#scroll:after {
  content: " ";
  position: absolute;
  top:50%;
  right:-10px;
  height:0;
  width:0;
  margin-top:-6px;
  border:6px solid transparent;
  border-left-color:#369fcf;
} 

Taruh Kode di bawah ini di bawah </head>

<div id='scroll'></div>

Kemudian Taruh kode di bawah ini di atas </body>

<script type='text/javascript'>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
   var viewportHeight = $(this).height(),
       scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
       progress = $(this).scrollTop() / ($(document).height() - viewportHeight),
       distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $('#scroll').height() / 2;
    $('#scroll')
        .css('top', distance)
        .text(' (' + Math.round(progress * 100) + '%)')
        .fadeIn(600);
    if (scrollTimer !== null) {
        clearTimeout(scrollTimer);
    }
    scrollTimer = setTimeout(function() {
        $('#scroll').fadeOut(600);
    }, 1000);
});
//]]>
</script>

Kemudian simpan template
Cukup sekian tutorial Membuat Persentase SCROLLBAR dari CR..Gimana mudah kan? untuk yang belum muncul scrollbarnya corat2 aja di bawah ini insyallah kami bisa bantu