Cara Pasang Page Scroller Back to Top / Down Onmouseover

Tombol yang biasa kita sebut tombol "back to top" sering kali kita jumpai di website / blog, yang fungsinya untuk memudahkan para pembaca artikel untuk melihat kembali bagian awal halaman / atas yang biasanya terletak di sudut kiri atau kanan bawah blog.

Pada kali ini saya akan mencoba berbagi tentang bagaimana cara memasang script "back to top" tersebut yang bukan hanya utuk scroll ke atas halaman saja, tetapi bisa secroll ke bawah juga dengan perlahan.

Script page scroller ini lumayan menarik juga, karena kita atau para pembaca cukup dengan menyentuh tombol ke atas / bawah yang terletak di sudut kanan bawah blog kita.

Untuk memasang script page scroller, seperti biasa kita Login dulu ke bloger - > Pilih Rancangan - > Edit HTML - > Copy script di bawah ini sebelum code </body>

<div id="staticbuttons" style="position:absolute;">
<a href="javascript:" onmouseover="myspeed=-thespeed" onmouseout="myspeed=0"><img
src="UrlGambar" border="0"></a><br>
<a href="javascript:" onmouseover="myspeed=thespeed" onmouseout="myspeed=0"><img
src="Urlgambar" border="0"></a>
</div>
<script>
//Page Scroller (aka custom scrollbar)- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use
var Hoffset=70 //Enter buttons' offset from right edge of window (adjust depending on images width)
var Voffset=80 //Enter buttons' offset from bottom edge of window (adjust depending on images height)
var thespeed=3 //Enter scroll speed in integer (Advised: 1-3)
var ieNOTopera=document.all&&navigator.userAgent.indexOf("Opera")==-1
var myspeed=0
var ieHoffset_extra=document.all? 15 : 0
var cross_obj=document.all? document.all.staticbuttons : document.getElementById? document.getElementById("staticbuttons") : document.staticbuttons
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function positionit(){
var dsocleft=document.all? iecompattest().scrollLeft : pageXOffset
var dsoctop=document.all? iecompattest().scrollTop : pageYOffset
var window_width=ieNOTopera? iecompattest().clientWidth+ieHoffset_extra : window.innerWidth+ieHoffset_extra
var window_height=ieNOTopera? iecompattest().clientHeight : window.innerHeight

if (document.all||document.getElementById){
cross_obj.style.left=parseInt(dsocleft)+parseInt(window_width)-Hoffset+"px"
cross_obj.style.top=dsoctop+parseInt(window_height)-Voffset+"px"
}
else if (document.layers){
cross_obj.left=dsocleft+window_width-Hoffset
cross_obj.top=dsoctop+window_height-Voffset
}
}
function scrollwindow(){
window.scrollBy(0,myspeed)
}
function initializeIT(){
positionit()
if (myspeed!=0){
scrollwindow()
}
}
if (document.all||document.getElementById||document.layers)
setInterval("initializeIT()",20)
</script>

Silakan ganti UrlGambar dengan url gambar yang telah sobat siapkan.
Apabila menemui kesulitan dalam pemasangan script di atas, coba scriptnya di parse dulu di SINI .

Selamat mencoba, semoga bermanfaat..!