Cara Membuat Persentase Scroll Bar di Blog

Cara Membuat Persentase Scroll Bar di Blog   - Hallo Sahabat Blogger, pada kesempatan ini saya mau membagikan Tutorial  Cara Membuat Persent...

Cara Membuat Persentase Scroll Bar di Blog - Hallo Sahabat Blogger, pada kesempatan ini saya mau membagikan Tutorial Cara Membuat Persentase Scroll Bar di Blog, Sebenarnya persentase scroll bar ini tidak terlalu Wajib hanya saja tergantung selera anda juga,jika penasaran tidak ada salahnya dicoba.Tutorial ini tidak hanya untuk mempercantik Blog semata saja tetapi ini juga berfungsi untuk mengetahui sudah berapa persen Pengunjung mengscroll Postingan anda, dan Juga anda tidak perlu takut, Persentase Scroll Bar ini Ringan dan tidak akan memperlambat Blog Anda.

Untuk memasangnya pun tidaklah sulit, Ikutilah langkah-langkahnya :

1. Copy-paste Code dibawah ini tepat diatas Code ]]></b:skin> atau </style>

#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;
}

2. Copy-paste Code dibawah ini tepat dibawah </head>

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

3. Copy-paste Code dibawah ini tepat diatas </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>

Mudah bukan?, Dengan Membuat Persentase Scroll Bar, pengunjung dapat mengatahui Sudah berapa persen kah dia ngeScroll. Begitulah Tutorial Cara Membuat Persentase Scroll Bar Keren di Blog, Semoga Tutorial ini bermanfaat buat Kalian yang sudah mengunjungi Blog ini, Terima Kasih