Question

如果你看下面我在偏移-185添加几个类，当你向下滚动时，两个是动画/淡入淡出。当你向上滚过偏移量时，我想让条形淡出，但我无法实现这一点。我正在使用jQuery航点脚本http://imakewebthings.com/jquery-waypoints/

$('#wrapper').waypoint(function(event, direction) {
    $('#scroll-action').toggleClass('hidden', direction === "up");
}, {
    offset: -185
}).find('#scroll-action').waypoint(function(event, direction) {
    $('#scroll-action').removeClass('hidden');
    $(this).parent().toggleClass('sticky', direction === "down");
    $('#scroll-action').addClass('animated fadeIn');
    event.stopPropagation();
}, {
    offset: -185
});

Answer 1

我认为您应该稍微简化一下，这样可以更轻松地解决您的问题。您将需要更换逻辑，但将其简化为只使用带有#wrapper的航点，我认为是可行的方法。当您向下滚动时#wrapper在窗口上方185px处然后淡入#scroll-action。向上滚动然后淡出。我认为将航点也放在#scroll-action上可能会导致两者发生冲突。

$(function() {
  $('#wrapper').waypoint(function(event, direction) {
    if(direction === "up") {
      $('#scroll-action').fadeOut();
    } else {
      $('#scroll-action').fadeIn();
    }
  }, { offset: -185});
});

Here's a jsFiddle that is similiar to what you are doing, so you can see this in action.确保您将HTML窗口设置得很小。

在向上滚动时添加类有jQuery问题

1 个答案: