jquery - 刷新和缩小标题

我有用于缩小标头的此类代码（后跟“ else”命令，但这并不重要）。它工作正常，但是当我刷新已经滚动的页面时，我必须再次滚动以触发更改。刷新页面时如何更改显示的缩小版本并显示正确的缩小版本？在此先感谢您的建议。

 var shrinkHeader = 50;
  $(window).scroll(function() {
    var scroll = getCurrentScroll();
      if ( scroll >= shrinkHeader || scrollTop() >= shrinkHeader) {
$('.pasek-mini').hide();
 $('.pasek-mini').addClass('pasek-miniu').removeClass('pasek-mini');
$('.pasek-miniu').show();
 }

最佳答案

在页面加载时和滚动后都进行滚动位置比较，并执行标题缩小魔术。

function shrinkHeaderIfScrolled() {
    var scroll = getCurrentScroll();
    var shrinkHeader = 50;
    if ( scroll >= shrinkHeader || scrollTop() >= shrinkHeader) {
        $('.pasek-mini').hide();
        $('.pasek-mini').addClass('pasek-miniu').removeClass('pasek-mini');
        $('.pasek-miniu').show();
    }
}

$(document).ready(function() {
    shrinkHeaderIfScrolled();

    $(window).scroll(function() {
        shrinkHeaderIfScrolled();
    }
});

这是假设您在代码示例中同时包含了getCurrentScroll()函数和scrollTop()函数的情况，因为它们已包含在代码示例中。

否则，您可以使用：

function shrinkHeaderIfScrolled() {
    var shrinkHeader = 50;
    if ($(window).scrollTop() >= shrinkHeader) {
        $('.pasek-mini').hide();
        $('.pasek-mini').addClass('pasek-miniu').removeClass('pasek-mini');
        $('.pasek-miniu').show();
    }
}

$(document).ready(function() {
    shrinkHeaderIfScrolled();

    $(window).scroll(function() {
        shrinkHeaderIfScrolled();
    }
});

关于jquery - 刷新和缩小标题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22643757/