scrollTop（）导航上的平滑动画

Question

当我滚动时，我希望我的导航大小从90px减小到68px，我一直在使用jquery .css，它可以正常工作，但它并不是我想要的那么平滑，我认为我应该使用{{1 }}，但老实说，我不知道该怎么做，我用谷歌搜索，但找不到任何帮助吗？

animate()

function totop(){
        $(window).scroll(function() {
            if ($(this).scrollTop()) {
                $('#nav').css({'height':'68px'});
            } else {
                $('#nav').css({'height':'90px'});
            }
        });
    }
    totop();

#nav {
    width:100%;
    height:90px;
    background: linear-gradient(to bottom, rgb(44, 44, 44),rgba(29, 38, 51, 0.5) 50px);
    position: fixed;
    transition: .3s;
    z-index: 12312312312312;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}