Skip to content

Instantly share code, notes, and snippets.

@rahuls360
Created April 6, 2018 05:52
Show Gist options
  • Save rahuls360/a787038c6a7f35877f4fce24862d61de to your computer and use it in GitHub Desktop.
Save rahuls360/a787038c6a7f35877f4fce24862d61de to your computer and use it in GitHub Desktop.
Href Smooth Scroll to #id (responsive)
$("a[href='#id']").click(function(event){
$('html, body').animate({
scrollTop: $( $.attr(this, 'href') ).offset().top
}, 500);
event.preventDefault();
});
@rahuls360
Copy link
Author

Add +ve or -ve offset

$(".scroll").click(function(event){
$('html, body').animate({
scrollTop: $( $.attr(this, 'href') ).offset().top - 100
}, 500);
event.preventDefault();
});

@rahuls360
Copy link
Author

rahuls360 commented Oct 21, 2019

<script type="text/javascript">

  $("a[href]").click(function(event){
    const windowWidth = $(window).width();

    const mobileOffset = 140;
    const desktopOffset = 85;
    var offset;
    if(windowWidth <= 991){
      offset = mobileOffset;
    }else{
      offset = desktopOffset;
    }

    $('html, body').animate({
        scrollTop: $( $.attr(this, 'href').slice(1) ).offset().top - offset
    }, 500);

  });

</script>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment