Untuk membuat tombol yang kita maksud, kita hanya membutuhkan kode berikut:
<script type="text/JavaScript">
var topMargin = 300
var slideTime = 1200
var ns6 = (!document.all && document.getElementById);
var ie4 = (document.all);
var ns4 = (document.layers);
window.setInterval("main()", 10)
function floatObject() {
if (ns4 || ns6) {
findHt = window.innerHeight;
} else if(ie4) {
findHt = document.body.clientHeight;
}
}
function main() {
if (ns4) {
this.currentY = document.floatLayer.top;
this.scrollTop = window.pageYOffset;
mainTrigger();
} else if(ns6) {
this.currentY = parseInt(document.getElementById('floatLayer').style.top);
this.scrollTop = scrollY;
mainTrigger();
} else if(ie4) {
this.currentY = floatLayer.style.pixelTop;
this.scrollTop = document.body.scrollTop;
mainTrigger();
}
}
function mainTrigger() {
var newTargetY = this.scrollTop + this.topMargin
if ( this.currentY != newTargetY ) {
if ( newTargetY != this.targetY ) {
this.targetY = newTargetY
floatStart();
}
animator();
}
}
function floatStart() {
var now = new Date()
this.A = this.targetY - this.currentY
this.B = Math.PI / ( 2 * this.slideTime )
this.C = now.getTime()
if (Math.abs(this.A) > this.findHt) {
this.D = this.A > 0 ? this.targetY - this.findHt : this.targetY + this.findHt
this.A = this.A > 0 ? this.findHt : -this.findHt
} else {
this.D = this.currentY
}
}
function animator() {
var now = new Date()
var newY = this.A * Math.sin( this.B * ( now.getTime() - this.C ) ) + this.D
newY = Math.round(newY)
if (( this.A > 0 && newY > this.currentY ) || ( this.A < 0 && newY < this.currentY )) {
if ( ie4 )floatLayer.style.pixelTop = newY
if ( ns4 )document.floatLayer.top = newY
if ( ns6 )document.getElementById('floatLayer').style.top = newY + "px"
}
}
//-->
</script>
<div id="floatLayer" style="position: absolute; height:20px; width:15; left:650px; top:400px; z-index: 100"><a href="#"><img vspace="0" border="0" hspace="0" alt="Back to Top" width="15" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYaqq72UPt5EGKQisThQmggFiW0wYOBl5K4q1AnKwwXm70birBPh2vgkyo7DNC-JOTVxDkta8SSx_0_UjjdkVqXp5P7ZDcsZrwfs3HIfMIN8FdcQz1o6vwM9ZHV-i0F8kAlHoG-Ikqt1at/" height="25"/></a></div>
Cara memasangnya seperti biasa, login ke blogger >> Tata letak dan Tambah Gadget HTML. bagi teman-teman yang ingin mengganti gambar back to top, maka bisa diganti link yang berwarna seperti ini. tampilan dari link gambar di atas adalah seperti berikut ini:
Di atas adalah kode dan langkah-langkah untuk memasang tombol back to top yang letakknya mengikuti gerakan scroll browser, selanjutnya bagi teman-teman yang ingin memasang tombol back to top melayang/berada di kanan slalu (bisa diatur letaknya, NB ==> kode yg tlah saya sediakan di bawah ini sudah diatur untk tampil di bagian kanan bawah), maka tman2 bisa memperaktekkannya melaui langkah-langkah berikut:
Login ke blogger >> Tata Letak >> Edit HTML
Kemudian letakkan kode berikut tepat di bawah kode </Body>
<a href='#' style='display:scroll;position: fixed; bottom:5px;right:5px;' title='Back to Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYaqq72UPt5EGKQisThQmggFiW0wYOBl5K4q1AnKwwXm70birBPh2vgkyo7DNC-JOTVxDkta8SSx_0_UjjdkVqXp5P7ZDcsZrwfs3HIfMIN8FdcQz1o6vwM9ZHV-i0F8kAlHoG-Ikqt1at/'/></a>
Tampilan:
Simpan hasil kerjaan anda!
Nb:
Teman-teman juga bisa memilih beberapa gambar back to top berikut ini
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWZ3rIkZ8a8ECMHsqN3YvySoD4k3YdpTtDs8s768s-JKXZ9Gnpdpb21zvFK09EpVdjJGk6LOXRl2qm2IK95m65b2ShctA6HxH8XREu_N5hc8qc1_ud7kRP_W03nhaHFdD5bAACfflfHeAo/
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBlz4b-svD8QnAG2ZBHS8BGWIme8I98QSonCndfxyC3cOKHEK3XJGpGSw1u7469okB6iE0bDdPfcz_4zyAxC21rPhkEriKfKMmlVpGrkpbSWB5GBo7bQtyrooHWe5eiqyJAg61UUuOlSD0/
Semoga Bermanfaat []
Tags: cara memasang tombol back to top, memasang tombol kembali ke atas, tombol back to top untuk blogger, kode html back to top, script back to top