Tutorial cara letak butang back to top dengan Jquery efek

Back to top versi ni lagi mantap berbanding yang mula2 tu..sebab dia ada efek jquery....bila anda scroll ke bawah baru butang back to top tu muncul... bila dah sampai atas balik butang tu hilang secara fade away..beransur2 hilang..bukan ghaib terus.....

Dalam script ni aku setkan x la slow sangat...tapi memang steady...macam naik lif... cara pasang widget ni pun senang menang pinang...

Live demo dia ada dalam tutorial merapu kapu ni...sekeroll ke bawah nanti ada la mambang tanah muncul di bawah sebelah kanan tu.. lepas tu cuba terai kelik...nanti dia naik selow dan istidy..santai...

Mula2 pergi ke desbot---desaign---ada gadget---html / jabasekerip...kemudian masukkan code jabasekerip dibawah

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" >/***********************************************
* Scroll To Top Control script- &#169; Dynamic Drive DHTML code library(www.dynamicdrive.com)* Modified byPolskahackrew***********************************************/var scrolltotop={
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWxo9Y-gc__BKuRQhjqurMZQfptGau2KtwKMeUqq8pEmovOHhdFH4VCB6zLr7gUNlg4TlSdDMnlFAuPb6fmH6n17DaAFkP2qOHc23xYKcbDW-vnk5bL_3TOEe5Ch8QHnOZa3TgJqwiAgU/s1600/polska_up.png" />',
controlattrs: {offsetx:5, offsety:5},
anchorkeyword: '#top',
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport)
this.$control.css({opacity:0})
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1)
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})
},
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Scroll Back to Top'})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='')
mainobj.$control.css({width:mainobj.$control.width()})
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>

lepas masukkan code jabasekerip di atas kelik save....senangkan...

untuk menukar gambar butang tu cari dan gantikan url https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWxo9Y-gc__BKuRQhjqurMZQfptGau2KtwKMeUqq8pEmovOHhdFH4VCB6zLr7gUNlg4TlSdDMnlFAuPb6fmH6n17DaAFkP2qOHc23xYKcbDW-vnk5bL_3TOEe5Ch8QHnOZa3TgJqwiAgU/s1600/polska_up.png

dengan url gambar yang anda suka2 hati