Ad
Now we’ll see how to add
STEP #1 Log in to Blogger, go to Layout
Add a Gadget of HTML/JavaScript type.
Then add this code in to it:.
<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="http://i35.tinypic.com/sfia38.jpg" height="25" /></a></div>
Image Back To Top Buttons With Different Styles

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZg0vBE8zHI_mg3Ov9dfzHLS5iySHItJ4AT3DS_FA7rMfqy6BWKN2zyqoyeqw0GkOidR9Kcys3yS8Yrui-Zy6WyptcSJA0DRwP7igLN32U48RBWgLTNzv40uIRxh1_9jcGxslP20mtGOBK/s1600/bttp-5.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC5zRZwo0uH9rJq_-9dHz3GmIo5iEDQ3nwVbbdtyVit5vgb2daJoP_nwLKb_D-4hOVWXhXA36NjUDlz6j6guPrQLOzoyy_SWVVaWW4EIGBiAwHdfevmRftlT7ueNc-ovsP1EHtSh6AlpHU/s1600/bttp-4.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidvOleH3eNwmLF0Zd9dg-Re3vJBL0PGddDvhKwsmt5fSXPrRYb9SdL37wvlhVHMFxy3my99z0RzXYynbR-nNY0QUZpkLSJ5pH7pk_4EmwdFDQaeSeyTqMSINrjonBcXwshn4EoTT5YPdQR/s1600/bttp-3.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggYoq-HITu1n_ZY5nMV-JcPQyDeVkYfRZjQkDhgB_iwPPOiAo_856AddiBxAVF8crmEbRsTl88JKavPk-lF0wTadn_uWxDcDv62ikHQps6yOVDXffg4DvRQoQYiSmqZC_TGLIdlD7XXTbu/s1600/bttp-1.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOIorz42tKJyF5NAzYAuCt1I4MeLi0u9I0MPgdGF6QXjRPUel0d8Lb_zIMCNZW2KQK7a7sYQEaip6J4bVnTwxxqKMKsoSiODQnMZj0a8DAOtC2p5fTpoQnZrN8NPTikUE7LL5S9knpRfRs/s1600/bttp-2.png

http://4.bp.blogspot.com/_JwD5r652h00/SvDBBZGgr-I/AAAAAAAAAQg/1X96vgeWqaw/s400/bttp-6.png0/bttp-7.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMoat8Gn-vjbbyLTpkTcadGG2eauPl1Dofl_5_qb5fLMNfcJiCy9YVZ2v2_iWLRaA1bHxk1CS3jyzHHHUaMCU29Ua6jvnYekFQbjM7BaFi6_LdBwSkZjc8B8eJdD8A6FpPSWkCGGfE-Fp0/s400/bttp-10.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNC3YvrTikvswreU1tgp-Gy9jwVvcYdkSTBRIQCuoHzIcrAVqBJS-dMRFl1qV98txehD2ZUYOYyCVlOPNfldfklibJaYQ2TNvvoixubmwCIpVEvfxPnpnDmcj2sWfoyKrR7jo6oSwULo-k/s400/bttp-9.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg91vI8LqAdj3vMGbiSmzc0YHmsLWtDWBbzJETSrmejZAW5eWj1XcqoM0Ap2U9MCNZRDIMoEr1nBlsw1ubUbVV_nPxBU-BBx-sGUfrgekIx2j7pLvNDDH7ixrnG4YcMqg6_wUIKyARwNrAi/s400/bttp-8.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3ttVBDea6BV1RpF5iQPlfUt-dqZtmFtT5Gfr7SItSrrrH8jHN9rfQYSXUmbw9DudoQBUou3Zth8U5TbXsfXL61U4KlJ80Trfy84Gunjr2ZMQsjZv3SGBPQQm5CjIk6Y7Xdr61czN75NJu/

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIZBCTlQHvAiRD8WxZ7wCawQOSpTbO7ynEN3LD_9Ee8AA7y89lkJ9_p7YXKeKcmUiMsuDU3MFsG2DwPj31y3xNkn_eSPJ-yX3kOZJjAuaTIS_An6PNAFiieWtQD9F7A7d0CeWkwhP1ne7v/s400/bttp-11.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibCPzVsQJ-wsV3kZpgFWUp1TEx9rMCMcsTthFZqkRlqSNzG-E3dpN26Xbhu1tiPj0trk8soWHyR090H06fp5x4fkRjgt9wuzwjqZgaakDbTFB3YFeLrZCwZf-eQaPB9eGrHBWAo8g6guXn/s400/bttp-12.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBjhAMTPE2wA7CZVu8fyPYKsp8jllYb7HsUI7ssv4hOmavjqJa4Jy3mBw7LPXvwoy3a_nU6gMQI8BXlFv0y_viM8_abIVozTD_YWHM6REVh0nWsQc9rw452Opz7Iy_RAoxOg76ypW8w1Oa/s400/bttp-13.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA3uh4_MoGBFSTW86aplC1OiHB91BGrHxCuKwN_5Z7P-tnf8RCraQLhfdKWCUXj8kUNBJ65DtV1t1-h-tGAGW19zHsxN_IKj83A4bBGPSp6KqzGKx4-aivcxzkE6veBXmOCowlxeM0uMim/s400/bttp-14.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9Q4OqHPDmK-ln9Mi7Tqyr7N3FyLHOqR1uQki1fYVsh0yEFqR65-bwj1UQUC2yUpXcnBEzv7imSZyNobHofSlW35X_MN-NHWjFsysKz9KDLVXqjDsU9_VHZgyE0BGs-430Ku9jGmJ4por3/s400/bttp-15.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHfLXsqybm8HRhTwuNBrh_yvjQx62-QaFXIILgezsvB968egOA2iKpOSiDOIKPoabk4gEsNDAt2ohOQzFzXMGsgJvUOlywhN0LUdqqZb7yjINbS-b4j8Xvktz9egXcADDRZ9xqxdICx2pZ/s1600/bttp-16.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbRzNZtHiXtJy_RoC1GHaswjr-fsL_U1x0GaRo1FsAzkU755NPoSBQL4lDnSVjDIjlCyOH33N42zBYu_IFtO_2KXyXC0fi3MsniZE8t34jELVYnRWxdw9NRSeLxF_w-5sej8etHNaADTxX/s400/bttp-17.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil8X3_-jX9t1Tv5Yjs9hzrUqgJG_wYvQXAU-ZsSs1D9Rwgspr4dPnxE-bDmkoenUYdtm926bNgfM7pGOODeoZRRWXdc0itD9SCtXMiEMT63dLzjBEvpF8fLLU8a-GrrG-z8GyUHNcg3F99/s400/bttp-19.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqaPqA6Omqm919UYOGegtNsxJbyrFZj_tPBhnpcILEzlcbCpXn8AC7Jk00YeRmV1lcWDF6rakVkEZcNRcoNHt4TFgMdfSVIMjyfSgMt0Cl75H4gXL4du1qRXRGSxlz8UGKBVGW3d2OaXEE/s400/20.png
ConversionConversion EmoticonEmoticon