Hello everybody, Today we learn a beautiful and amazing
blogger widget Add Rocket Back to Top Widget for blogger blog. It is so helpful
for visitor and most important for every blog because through this your
visitors can go easily back to top.
How to Add this
Following these steps
Step # 1: Login to your account and go to Template > Edit HTML
Step # 2: Click Ctrl + F and search this </body> tag
Step # 3: Copy the following code and paste after </body> tag
<style>#rocketbacktotop{background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2u11w1osgbmi-Z28zNa-g2Tm8bpK8J-CSMPwugeDhAfwxOY91NTNojyFt9ixzqlbIrRByol-qR4VtoBq_IPD-DRIFF3vAEsWA8Tld0gDz8r4ANnD35PziqFZqTB8LGTKFSTDCW_k_3RjO/s1600/back-to-top-sprite-30224d9b.png') 0 0 no-repeat;height: 130px;width: 72px;padding:5px;position:fixed;bottom: 5px;right: 5px;cursor:pointer; z-indez:1;} #rocketbacktotop:hover{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2u11w1osgbmi-Z28zNa-g2Tm8bpK8J-CSMPwugeDhAfwxOY91NTNojyFt9ixzqlbIrRByol-qR4VtoBq_IPD-DRIFF3vAEsWA8Tld0gDz8r4ANnD35PziqFZqTB8LGTKFSTDCW_k_3RjO/s1600/back-to-top-sprite-30224d9b.png)no-repeat;background-position: 0 -142px;}</style><!-- Back to top button by Mourad Elktarni --><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js'/><script type='text/javascript'>//<![CDATA[$(window).scroll(function(){if($(this).scrollTop()>100){$("#rocketbacktotop").removeAttr("href");$("#rocketbacktotop").stop().animate({bottom:"0"},{duration:100,queue:false})}else{$("#rocketbacktotop").stop().animate({bottom:"30000"},{duration:8000,queue:false})}});$(function(){$("#rocketbacktotop").click(function(){$("html, body").animate({scrollTop:0},"slow");return false})});//]]></script><!-- Code provided to you by Allblogger.tips --><a href='#' id='rocketbacktotop'/>
Step # 4: Save template
Done and enjoy.
0 comments:
Post a Comment