ScrollTo: #div tag instead of top of page

171 Views Asked by At

I am trying to use the ScrollTo function in this little snippet of code so my page scrolls to an ID div tag instead of the top of page "0". Any help would be much appreciated!

Here is the code I'm using to scroll to the top of the page. All works fine just need to figure out how to add in a div location rather than it just going to the top.

I should also mention I am using smoothstate.js

Thanks so much for the help :)

$(function(){
  'use strict';
  var $body = $('html,body, #smoothState');
  var options = {
    prefetch: true,
    cacheLength: 2,
    blacklist: ".no-smoothstate a, .post-edit-link,  a[href*='.jpg'], a[href*='.png'], a[href*='.jpeg'], a[href*='.pdf']",

onStart: {
  duration: 0, // Duration of our animation
  render: function ($container) {
      $('.spinner').fadeIn(0);
    // Add your CSS animation reversing class
    $container.addClass('is-exiting');




    $body.animate({
          scrollTop: 0
        });
    // Restart your animation
    smoothState.restartCSSAnimations();
  }
},




onReady: {
  duration: 0,
  render: function ($container, $newContent) {
      $('.spinner').fadeOut(0);
    // Remove your CSS animation reversing class
    $container.removeClass('is-exiting');



    // Inject the new content
    $container.html($newContent);



     }
  },
1

There are 1 best solutions below

0
On

Here is how I am doing it now. Seems to be working fine. Hope this helps out some others that are not so pro at jQuery like myself haha :)

$('html, body').animate({
scrollTop: $("#target-element").offset().top
}, 1000);