Wordprss- Add "Scroll To Top" button in WordPress

Blow are the easy steps to add "Scroll To Top" button in WordPress website.

Step-1 Add this Div in footer.php

 

Step-2 Add this Java script in footer.php

 
jQuery(function() {
 jQuery(window).scroll(function() {
 if(jQuery(this).scrollTop() > 300) {
  jQuery('#back_top').fadeIn();   
 } else {
  jQuery('#back_top').fadeOut();
 }
});
   jQuery('#back_top').click(function() {
 jQuery('body,html').animate({scrollTop:0},500);
});   
});

Step-3 Add this CSS in theme's style.css

 
    #back_top {
    background-color: red;
    bottom: 22px;
    cursor: pointer;
    display: none;
    height: 44px;
    position: fixed;
    right: 200px;
    width: 54px;
}

No comments:

Post a Comment