Jquery: How to get Offset() negative value [SOLVED]

[crispybagel]

Hi, i'm trying to make a simple scroll on click button. It currently scrolls to an element of choice. However, Offset() chooses the first child element inside the element i specified in my scrollTop selector. Basically it goes past the top of the element i actually want to scroll to. An easy fix would be to just offset the scroll -5vw, but Offset() doesn't accept a negative value. Any workarounds for this?

 

$("#post_1").click(function(){
    $('html, body').animate({
      scrollTop: $(".blpost_frame"). offset(). top}, 500)
  });

 

[colonel_mortis]

Is there a reason that you can't just subtract from the value returned by .offset().top directly?

$("#post_1").click(function(){
  $('html, body').animate({
    scrollTop: $(".blpost_frame").offset().top - 5 // Scroll to 5px above the top of .blpost_frame
  }, 500)
});

You have to specify the offset in pixels rather than any of the relative CSS units, but if you really need to use relative units then it is possible to convert them manually.

 

Offset is supposed to get the actual offset position, but it doesn't take into account margin on the html element (docs). Is it possible that you have a margin on the html element which is throwing off the offset calculation, so removing that would allow the code to work unmodified?

[crispybagel]

On 2/1/2020 at 3:05 PM, colonel_mortis said:

Is there a reason that you can't just subtract from the value returned by .offset().top directly?

$("#post_1").click(function(){
  $('html, body').animate({
    scrollTop: $(".blpost_frame").offset().top - 5 // Scroll to 5px above the top of .blpost_frame
  }, 500)
});

You have to specify the offset in pixels rather than any of the relative CSS units, but if you really need to use relative units then it is possible to convert them manually.

 

Offset is supposed to get the actual offset position, but it doesn't take into account margin on the html element (docs). Is it possible that you have a margin on the html element which is throwing off the offset calculation, so removing that would allow the code to work unmodified?

Hmm, as i understand it, the scrollTop function returns the top position of the first child in the element specified, which is positioned 2.5vw below the top of "blpost_frame". And i read that you can't specify a negative value for offset() but i'll try your solution and see if it works. 

[crispybagel]

Thanks @colonel_mortis it works like a charm now!