How to add Scroll To Top button in Magento

Scroll To Top button in Magento

Open your header.phtml file and write below code:

<a href="#" class="scrollToTop">Scroll To Top</a>

<script type="text/javascript">

jQuery(document).ready(function($){
//Check to see if the window is top if not then display button
$(window).scroll(function()

              {
if ($(this).scrollTop() > 100) {
$('.scrollToTop').fadeIn();
}

              else 

               {
$('.scrollToTop').fadeOut();
}
});
//Click event to scroll to top

$('.scrollToTop').click(function() 

              {
$('html, body').animate({scrollTop : 0},800);
return false;
});
});
</script>

Add style code in styles.css file. 

<style>
.scrollToTop{
width:100px;
height:100px;
padding:10px;
text-align:center;
font-weight: bold;
color: #444;
text-decoration: none;
position:fixed;
top:75px;
right:40px;
display:none;
background: url('images/arrow_up.png') no-repeat 0px 20px;
}
.scrollToTop:hover{
text-decoration:none;
}
</style>

Note: Please Download image and upload in image folder.