Cara Membuat Tombol Up Down Pada Blog

Sebelumnya Saya sudah pernah Posting tentang "Cara Membuat Double Klik untuk Back To Top (Kembali Ke Atas) Pada Blog", dan "Cara Menambahkan Gambar Back To Top (Kembali Ke Atas) Pada Blog". Tips kali ini agak berbeda dengan sebelumnya, karena Tips kali ini Kalian tidak perlu meng-Klik gambar, tapi tinggal taruh Kursor Mouse Kalian pada gambarnya, dan Secara otomatis akan bergerak Ke Atas maupu Ke Bawah. Bagaimana, Kalian tertarik...? jika tertarik, silahkan ikuti langkah-langkah di bawah.

[1]. Pertama, Login dulu ke Blog Kalian.
[2]. Kedian dari Dasbor, cari Rancangan --> Edit HTML.
[3]. Lalu cari Code </body>.
[4]. Kalau sudah ketemu, Copy dan Paste-kan Code di bawah ini, tepat di ATAS Code </body>.
<div id="staticbuttons" style="position:absolute;">
<a href="javascript:" onmouseover="myspeed=-thespeed" onmouseout="myspeed=0"><img
src="http://i1367.photobucket.com/albums/r795/apitartwork/navigate-up_zpsa1b5484b.png" border="0" /></a><br />
<a href="javascript:" onmouseover="myspeed=thespeed" onmouseout="myspeed=0"><img
src="http://i1367.photobucket.com/albums/r795/apitartwork/navigate-down_zps64ff61dc.png" border="0" /></a>
</div>
<script type='text/javascript'>
//<![CDATA[
var Hoffset=60
var Voffset=60
var thespeed=10 //Kecepatan
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>
[5]. Terakhir tinggal di SAVE, dan lihat hasilnya.

KETERANGAN :
- Tulisan yang berwarna Biru, ganti dengan URL Gambar Kalian.
- Dan tulisan yang berwarna Kuning, menunjukan kecepatannya. Semakin besar angkanya, semakin cepat pula gerakannya.

Semoga Berhasil...!!! ^_^

0 Response to "Cara Membuat Tombol Up Down Pada Blog"

Posting Komentar

Catatan :
- Boleh berupa kritik dan saran
- Usahakan komentar tidak menyinggung
- Tidak mengandung kata-kata kasar
- Tidak berbau porno
- No spam