CODEWITHSUNDEEP
javascriptjqueryscrolltop
Patrick
Patrick

Reputation: 820

Scroll 80px above id position instead of on id position

I have this snippet which on load scrolls to the #id on the page. The problem is our sticky navigation is 80px tall so it covers the part I would like visible when it scrolls to that specific #id.

This code works great. But how do i make it scroll 80px above the id instead of exactly at the #id. (its a wordpress site)

jQuery(document).ready(function($){
   if ( $(window).width() < 768){ 
    if( $('body.woocommerce-page').length || $('body.single-product').length ){
     $('html, body').animate({ scrollTop: $("#scrollto1").offset().top}, 1250); 
    }
   }
});

Thanks for any help!

Upvotes: 0

Views: 328

Answers (1)

Deividas
Deividas

Reputation: 6507

You can just subtract 80 from the .offset().top. See below.

jQuery(document).ready(function($){
   if ( $(window).width() < 768){ 
    if( $('body.woocommerce-page').length || $('body.single-product').length ){
     $('html, body').animate({ scrollTop: $("#scrollto1").offset().top - 80}, 1250); 
    }
   }
});

Upvotes: 1

Related Questions