title: How to Add Smooth Scrolling Back To Top Button using react js?
body: <p>I have implemented this using jquery but want to create a component in react to do the same</p>
  
  <pre><code>&lt;script&gt;            
  jQuery(document).ready(function() {
      var offset = 220;
      var duration = 500;
      jQuery(window).scroll(function() {
          if (jQuery(this).scrollTop() &gt; offset) {
              jQuery('.move-top').fadeIn(duration);
          } else {
              jQuery('.move-top').fadeOut(duration);
          }
      });
  
      jQuery('.move-top').click(function(event) {
          event.preventDefault();
          jQuery('html, body').animate({scrollTop: 0}, duration);
          return false;
      })
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>In my page footer </p>
  
  <pre><code>&lt;a href="#" class="move-top"&gt;↑&lt;/a&gt;
  </code></pre>