Cara Membuat Page Scroller ( Custom ScrollBar )

Oke...Lama juga ga posting nich...iseng-iseng dech coba posting yang satu ini...
Awalnya mondar-mandir cari-cari artikel, pas ketemu trik ini...kayaknya boleh juga nich buat ngehias blog, trik ini saya dapatkan di Dynamic Drive, namun saya otak-atik sedikit untuk menyesuaikan dengan format pada Blogger, karena trik ini spesialnya ditujukan buat para penggila web.

Tujuan postingan kali ini agar bisa menjadi alternatif dalam arti kata biar bisa membantu para pengunjung blog agar tidak lelah mengunjungi blog kita, apalagi ketika membuka halaman blog yang panjangnya minta ampun sampe puluhan hingga ratusan artikel, sehingga membuat lelah pengunjung blog untuk men-scroll halaman blog kita. ini cuma alternatif looohhh....

Lanjuuutttt...
Nah postingan kali ini mengangkat tentang Cara Membuat Auto Page Scroller di Blog kita. Untuk contohnya anda bisa mengarahkan cursor anda ke gambar seperti tanda panah ke atas dan kebawah di pojok kanan bawah pada halaman blog ini.

Naaahhh...sudah dicoba...???
Jika anda tertarik untuk menggunakannya, anda bisa mencoba cara-caranya dibawah ini :

• Pertama-tama Login dulu ke Blogger
• Masuk ke Layout/Tata Letak
• Terus menuju ke Edit HTML
• Jangan lupa download dulu templatenya, agar jika terjadi kesalahan bisa diperbaiki.
• Nah...sekarang cari code </body> , biasanya letaknya paling bawah.
• Copy code ini sebelum code </body> 

<div id="staticbuttons" style="position:absolute;">
<a href="javascript:" onmouseover="myspeed=-thespeed" onmouseout="myspeed=0"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_8Jkyuz-Js3B9Lx5tMdLUJbaueAJ6Fmv0KJyTq1YTNfxG56b7DF0vPMp3nsTgzz6AKP8_vMAAncjGXcw7Npig0c2rhtRJr4ljaYz25ra3-d8ZX3CXGHBQrYQuao8PBzVuYbrWjikqy0g/s320/BUTTONUP.png" border="0"/></a><br/>
<a href="javascript:" onmouseover="myspeed=thespeed"
onmouseout="myspeed=0"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9D1XvlBAXqMUu025znPegAH58egJE2FjGduIu37ddzBOyNrdVrdDzhaNMpR2JWgY90RclHlWXD3W6NSYb7zvhzb7rml1Cl_QFdSgwaNZH7I4gTBQhWZ9eBm3EJKWTCUW0iwz4Pt2-Akg/s320/BUTTONDOWN.png" border="0"/></a>
</div>
<script>
var Hoffset=70
var Voffset=80
var thespeed=3
ieNOTopera=document.all&amp;&amp;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 &amp;&amp;
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>

• Ganti tulisan berwarna merah dengan link gambar anda
• Sesuaikan Angka berwarna biru(kecepatan scroll) dengan selera anda
  
• Simpan dech....
• Coba lihat hasilnya...

Image link :
UP :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_8Jkyuz-Js3B9Lx5tMdLUJbaueAJ6Fmv0KJyTq1YTNfxG56b7DF0vPMp3nsTgzz6AKP8_vMAAncjGXcw7Npig0c2rhtRJr4ljaYz25ra3-d8ZX3CXGHBQrYQuao8PBzVuYbrWjikqy0g/s320/BUTTONUP.png
DOWN :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9D1XvlBAXqMUu025znPegAH58egJE2FjGduIu37ddzBOyNrdVrdDzhaNMpR2JWgY90RclHlWXD3W6NSYb7zvhzb7rml1Cl_QFdSgwaNZH7I4gTBQhWZ9eBm3EJKWTCUW0iwz4Pt2-Akg/s320/BUTTONDOWN.png

SELAMAT MENCOBA

SEMOGA BERMANFAAT

TERIMA KASIH

(sumber : www.dynamicdrive.com )