Cara Membuat Scroll Bar Persentase Di Blog Terbaru

Mau blog scroll bar kamu ada persentasenya seperti gambar yang di atas saya akan berbagi tutorialnya, ok langsung aja silahkan kamu paste script di bawah ini ,,

pertama silahkan login dulu ke blogger , lalu klik Template >> klik Edit HTML >> lalu cari code ini ]]></b:skin>, atau Ctrl+F biar cepet,, copy script ini :

#scroll { display: none; position: fixed; top: 0; right: 20px; z-index: 500; padding: 3px 8px; background-color: #2187e7; color: #fff; border-radius: 3px; } #scroll:after { content: " "; position: absolute; top: 50%; right: -8px; height: 0; width: 0; margin-top: -4px; border: 4px solid transparent; border-left-color: #2187e7; }

kalo sudah cari code </head> copy script ini dan pastekan tepat di bawah code </head>

<div id='scroll'/>

lanjut lagi , cari code </body> copy script ini dan pastekan tepat di atas code </body>

<script type='text/javascript'> var addthis_config = addthis_config||{}; addthis_config.data_track_addressbar = false; addthis_config.data_track_clickback = false; </script> <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(100); if (scrollTimer !== null) { clearTimeout(scrollTimer); } scrollTimer = setTimeout(function() { $('#scroll').fadeOut(); }, 1500); }); //]]> </script>

kalo sudah semua Simpan Template dan lihat hasilnya, kalo mau lihat demonya sobat tiggal lihat di blog ini,,  Semoga... Bermanfaat...