Gedget Back To Top adalah Fasilitas Blog yang membantu tampilan dan home page untuk blog anda, tujuan utama dari pemasangan widget ini agar visitor anda tidak terlalu capek untuk
mengscrool page anda jika dia ingin kembali ke atas halaman utama anda.
|
Widget To Top Smooth |
Uniknya Script yang saya dapatkan dari mas
Ahmad membarikan to top dengan smooth/halus ke atas.
Future To Top Smooth
Copy script dibawah.
<!--Back to top script-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" >
var scrolltotop={
setting: {startline:50, scrollto: 0, scrollduration:1000, fadeduration:[500, 200]},
controlHTML: '<img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZignGEIubYtZuIB1OezSRDl94E0IbpQ23EfN04-IPZl1SIxkQ_RXX7NpEiy_Esm6Y1exsfErixEXDgHoxmrCOr8EVrPhmsm5XSmQy8JkA1zohAYiyUAuReYtlqipCT2hS8yawj6X7iweg/s1600/arrow-up-icon.png"
/>',
controlattrs: {offsetx:5, offsety:5},
anchorkeyword: '#top',
state: {isvisible:true, 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 //not
IE or IE7+ browsers in standards mode
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()!='') //khusus versi IE6 ke bawah untuk loose
check, juga untuk melihat apakah control mengandung teks
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- perlu
diset witdh yang jelas agar kontainer text terbentuk dengan rapi
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>
<!--Back to top script end-->
Note: Ganti
warna pink dengan URL gambar anda.
Beberapa Icon/Gambar yang mungkin anda dapat gunakan :
Kemudian, Silahkan masuk blog anda.
Dashboard >> Tata Letak >> Tambahkan Gadget >> Html/Javascript | Pastekan Code diatas ke widget | Save
Sekian dan semoga cepet anda gunakan script to top agar lebih memudahkan visitor anda. Baca artikel sebelumnya -->
Tempat Membeli Hosting Domain Baik dan Terpercaya