javascript - Javascriptのscroll-to関数、javascriptでヘッダーの高さを検出する方法は？

Question

私には理解できないような単純な問題があります。私はjavascriptに少し慣れていません。

ヘッダーが固定された単一ページのWebサイトを作成しています。私のナビゲーションは、リンクされたdivにスクロールし、上部を80px（ヘッダーの高さ）オフセットするjavascript関数を利用しており、完全に機能します。

これがjavascriptです：

$(document).ready(function(){

    $('#nav li a').click(function(){

        var el = $(this).attr('href');
        var elWrapped = $(el);

        scrollToDiv(elWrapped,40);

        return false;

    });

    function scrollToDiv(element,navheight){
        var offset = element.offset();
        var offsetTop = offset.top;
        var totalScroll = offsetTop - 80 + "px";

        $('body,html').animate({
                scrollTop: totalScroll
        }, 500);

    }



});

私の問題は、私のWebサイトがモバイルにロードされると、ヘッダーが約215pxに成長し（私はスケルトンフレームワークを使用しています）、スクロールto機能が引き続き80pxをスクロールすることです。javascriptを使用してヘッダーの高さを動的に検出し、固定の高さを使用するのではなく、このスクロールに挿入して機能させるにはどうすればよいですか？

Answer 1

$（ "＃header"）。outerHeight（）は、＃header要素の合計の高さを返します。