0

我正在创建 magento 商店，我想在用户滚动窗口后使 toTop 按钮可用。

我在下面粘贴了我的代码，它工作正常，但是在窗口位于顶部之后，我不能再移动它了，它被卡住了。

jQuery(window).scroll(function() {
    var top = jQuery(window).scrollTop();

    if (top > 77) {
    jQuery(function() {
        jQuery('img.arrowup').fadeIn();
        jQuery('div.header_bg').show();
        jQuery('div.mainmenu').addClass('stick');
        jQuery('body div.header-container').next().addClass('pad');
        jQuery("img.arrowup").on('click', function(e) {
        e.preventDefault();
        jQuery('body,html').animate({scrollTop:10},800);
    });
    })} else {
        jQuery('div.header_bg').hide();
        jQuery('img.arrowup').fadeOut();
        jQuery('body div.header-container').next().removeClass('pad');
        jQuery('div.mainmenu').removeClass('stick');
    }

});

==============================

感谢大家的帮助，这是带有标头和 toTop 动画的工作解决方案:)

    var scrollDiv=jQuery(this);
    jQuery(window).scroll(function(){  
        if(jQuery(window).scrollTop()<="77"){
            jQuery("img.arrowup").fadeOut("slow");
            jQuery('div.header_bg').hide();
            jQuery('div.mainmenu').removeClass('stick');
        } else {
            jQuery("img.arrowup").fadeIn("slow");
            jQuery('div.header_bg').show();
            jQuery('div.mainmenu').addClass('stick');
        }
    });
    jQuery("img.arrowup").click(function(){
        jQuery("html, body").animate({scrollTop:0},"slow");
    });
4

1 回答 1

0

我建议先阅读这个答案，以了解为什么动画会产生冲突取决于滚动值，而不是尝试一下：

$(document).ready(function() {
   $(window).scroll(function() {
      var scrollVal = $(this).scrollTop(); // use this instead of window

      if ( scrollVal >= 0 &&  scrollVal < 77 ) {
         //do something without animations
         $('div.header_bg').hide();
         $('div.mainmenu').removeClass('stick');

      } else if ( scrollVal === 77 ){
         //i didn't try this before but it may work,
         //since value equals 77 once, it may not create animation conflicts
         $('img.arrowup').fadeIn();

      } else if ( scrollVal > 77 ) {
         //do something without animations
         $('div.header_bg').show();
         $('div.mainmenu').addClass('stick');
      }
  });
});
于 2013-02-06T18:25:07.233 回答