javascript - Jquery を使用した Div ID へのスクロール

Question

css プロパティが原因で、div タグへのスクロールでマージントップが多すぎます。したがって、jquery がこれを修正するための最良のソリューションであると考えています。

これが機能しない理由がわかりません.JsとJqueryは初めてです。どんな助けでも大歓迎です。

ここで、Js について簡単に説明します。div id がコンテナーにある場合、('html, body') を ('container) に変更することがわかりました

これが私のjsfiddleです

     jQuery(document).ready(function($){
var prevScrollTop = 0;
var $scrollDiv    = jQuery('div#container');
var $currentDiv   = $scrollDiv.children('div:first-child');

var $sectionid    = 1;
var $numsections  = 5;

$scrollDiv.scroll(function(eventObj)
{
    var curScrollTop = $scrollDiv.scrollTop();
    if (prevScrollTop < curScrollTop)
    {
    // Scrolling down:
        if ($sectionid+1 > $numsections) {
            console.log("End Panel Reached");
        }
        else {
            $currentDiv = $currentDiv.next().scrollTo();
            console.log("down");
            console.log($currentDiv);
            $sectionid=$sectionid+1;
            console.log($currentDiv.attr('id'));
            var divid =$currentDiv.attr('id');
            jQuery('#container').animate({scrollTop:jQuery('#'+divid).position().top}, 'slow');
            }
    }
    else if (prevScrollTop > curScrollTop)
    {
    // Scrolling up:
        if ($sectionid-1 == 0) {
            console.log("Top Panel Reached");
        }
        else {
            $currentDiv = $currentDiv.prev().scrollTo();
            console.log("up");
            console.log($currentDiv);
            $sectionid=$sectionid-1;
            var divid =$currentDiv.attr('id');
            jQuery('html, body').animate({scrollTop:jQuery('#'+divid).position().top}, 'slow');

            }
    }
    prevScrollTop = curScrollTop;
});
});