title: jQuery Smooth Scroll to Top AND to Anchor by ID (with Offset)
body: <p>this is an extension to a questions that was previously answered here: <a href="https://stackoverflow.com/questions/37931726/jquery-smooth-scroll-to-top-and-to-anchor-by-id">See Prevoius Question</a></p>
  
  <p>I have a bit of jQuery that is adding BOTH a smooth scroll to top function, AND a smooth scroll to any anchor found on a page.</p>
  
  <p>Now, I just need to add an offset to the anchor scroll (110px) to account for fixed headers, WITHOUT messing up the scroll to top function.</p>
  
  <p>Here's the existing code:</p>
  
  <pre><code>// Add To Top Button + Smooth Scroll to Anchors functionality
  jQuery(document).ready(function($){
      // Scroll (in pixels) after which the "To Top" link is shown
      var offset = 700,
      //Scroll (in pixels) after which the "back to top" link opacity is reduced
      offset_opacity = 1200,
      //Duration of the top scrolling animation (in ms)
      scroll_top_duration = 700,
      //Get the "To Top" link
      $back_to_top = $('.to-top');
  
  //Visible or not "To Top" link
  $(window).scroll(function(){
      ( $(this).scrollTop() &gt; offset ) ? $back_to_top.addClass('top-is-visible') : $back_to_top.removeClass('top-is-visible top-fade-out');
      if( $(this).scrollTop() &gt; offset_opacity ) { 
          $back_to_top.addClass('top-fade-out');
      }
  });
  
  //Smooth scroll to top
  $back_to_top.on('click', function(event) {
      event.preventDefault();
      targetedScroll();
  });
  
  // example of smooth scroll to h2#anchor-name
  $('#some-button').on('click', function(event) {
      event.preventDefault();
      targetedScroll('anchor-name');
  });
  
  // bind smooth scroll to any anchor on the page
  $('a[href^="#"]').on('click', function(event) {
      event.preventDefault();
      targetedScroll($(this).attr('href').substr(1));
  });
  
  // scrolling function
  function targetedScroll(id) {
      // scrollTop is either the top offset of the element whose id is passed, or 0
      var scrollTop = id ? $('#' + id).offset().top : 0;
  
      $('body,html').animate({
          scrollTop: scrollTop,
      }, scroll_top_duration);
  }
  
  });
  </code></pre>