Question

当我开始向下滚动页面时，我正在使用此代码为我提供不同的粘性徽标。

jQuery(function($) {
  $(window).scroll(function() {
    if ($('.x-navbar').hasClass('x-navbar-fixed-top')) {
      $('.x-navbar-fixed-top .x-brand img').attr('src', 'http://placehold.it/120?text=Secondary+Logo!');
    } else {
      $('.x-navbar .x-brand img').attr('src', 'http://placehold.it/120?text=Original+Logo!');
    }
  });
});

它工作正常，唯一的事情是当我向上滚动页面时，它不会将徽标更改回原始徽标。当我向上滚动到页面顶部时，如何调整代码以显示原始徽标？

Answer 1

您可以使用window.scrollY，代码看起来像这样

jQuery(function($) {
  $(window).scroll(function() {
   if(window.scrollY === 0) {
     $('.x-navbar .x-brand img').attr('src', 'http://placehold.it/120?text=Original+Logo!');
   }
   else
   {
    if ($('.x-navbar').hasClass('x-navbar-fixed-top')) {
      $('.x-navbar-fixed-top .x-brand img').attr('src', 'http://placehold.it/120?text=Secondary+Logo!');
    } else {
      $('.x-navbar .x-brand img').attr('src', 'http://placehold.it/120?text=Original+Logo!');
    }
   }
  });
});

XTheme中的粘贴标头的不同标志

1 个答案: