jQuery平滑滚动到div-奇怪的行为

Question

I have a web page which has a fixed header, and 3 main divs one below the other. One of the links in the header is made to smooth scroll to the last div. The scrolling works on first click, but when I click again, it scrolls to the top of page. So, basically it is behaving like a toggle. First click scrolls to div, next click scrolls to top of page.

The code I have is:

var targetOffset = $('#targetDiv').offset().top - 75;
$('html, body').animate({scrollTop: targetOffset}, 700);

Answer 1

The problem is you calculate the targetOffset on every click. Maybe this could work:

$( document ).ready(function() {
  var targetOffset = $('#targetDiv').offset().top - 75;
  $('#theLink').click(function(){
    $('html, body').animate({scrollTop: targetOffset}, 700);
  });
});