Гладкие элементы прокрутки внутри ребенка DIV, который находится ниже заголовок

Question

Так вот скрипка ссылка https://jsfiddle.net/malakar369/y5Lppeg0/8/

jQuery(document).ready(function ($) { 
    $('.custom-click').on('click', function (e) { 
    e.preventDefault(); 
    var href = $(this).attr('href'); 
    var current_div = $(href); 
    var animateTo = $(href).position().top ; 
    console.log(animateTo); 
    $('#main-height-container').animate({scrollTop: animateTo},"slow"); 
    }); 
}); 

Это работает, если мой DIV находится в верхней части страницы. Однако, так как это не вверху, у меня есть и обширная проблема. Может, любой из вас, ребята, мог бы взглянуть на него и помочь мне.

Благодаря

Answer 1

$ (HREF) .position(). Верх в координаты окна

Попробуйте

var animateTo = $("#main-height-container").scrollTop() - $("#main-height-container").position().top + $(href).position().top; 

https://jsfiddle.net/y5Lppeg0/9/