使用滚动和屏幕大小的嵌套 JQuery if 语句

尝试在滚动时更改导航栏的大小。唯一的区别是我需要两组尺寸，具体取决于屏幕尺寸。收缩类工作保证只是尝试调整功能以实现屏幕尺寸。

编辑：澄清一下，我想在有人向下滚动页面时调整导航栏的高度。还需要检查屏幕尺寸是否比 768px <或>，因为我需要两组尺寸。希望较大的集合从 250px 变为 150px，滚动时更改为 150px。在较小的屏幕上，我希望大小在 150px 和 70px 之间切换。

$(window).scroll(function() {
    if ($(window).width() > 768) {
        if ($(document).scrollTop() > 50) {
            $('nav').addClass('shrink');
            $(".navbar").css({
                'height': '150px',
            });
        } else {
            $('nav').removeClass('shrink');
            $(".navbar").css({
                'height': '250px',
            });
            else if ($(window).width() < 768) {
                if ($(document).scrollTop() > 50) {
                    $('nav').addClass('shrink');
                    $(".navbar").css({
                        'height': '70px',
                    });
                }
            } else {
                $('nav').removeClass('shrink');
                $(".navbar").css({
                    'height': '150px',
                });

编辑2：累了这样的东西，没有运气

        $(document).ready(function() {
          $(window).scroll(function() {
              if ($(document).scrollTop() > 50) {
                // check the screen size
                if ($(window).width() > 768) {
                  $('nav').addClass('shrink');
                  $(".nav-bar").css("height", "150px");
                } else {
                  $('nav').addClass('shrink');
                  $(".nav-bar").css("height", "80px");
                }
              } else {
                // back to normal when there is less scrolling 
                if ($(window).width() < 768) {
                  $('nav').removeClass('shrink');
                  $(".nav-bar").css("height", "250px");
                } else {
                  $('nav').removeClass('shrink');
                  $(".nav-bar").css("height", "100px");
                }
              });
          });

编辑3：我需要这样的东西...如何使其语法正确？

    $(window).scroll(function() {
        if ($(window).width() > 768) {      
            if ($(document).scrollTop() > 50) {
                $('nav').addClass('shrink');
                $(".navbar").css({
                'height':'150px',
            });
            } else {
                $('nav').removeClass('shrink');
                $(".navbar").css({
                'height':'250px',
            });
        } else {
            if ($(document).scrollTop() > 50) {
                $('nav').addClass('shrink');
                $(".navbar").css({
                'height':'120px',
            });
            } else {
                $('nav').removeClass('shrink');
                $(".navbar").css({
                'height':'140px',
        }
        });
    }
});
});