javascript - 你如何反向滚动......所以它从下到上？

Question

这个问题已经有答案了:

Reverse Scrolling (1 个回答)

已关闭 5 年前。

今天在我的实习中，我被要求将他们想要制作的网站......从下到上设为红色。老实说我从来没有见过这样的网站...所以让我们把所有 UI/UX 问题放在一边你是如何做到的，那么你是不是把它放在页面的底部，并使向下滚动实际上向上滚动？(左右)

Answer 1

在 jQuery 上保留现成的解决方案(这可行，但这是工件，您需要改进以与嵌套 block 中的滚动进行交互):

function onScroll(velocity) {
  var win = $(window)  
  $(win).on('wheel', function(event) {
    event.preventDefault()
    var direction = event.originalEvent.deltaY > 0? 'down': 'up';    
    var position = win.scrollTop();

    if (direction === 'up') {
        $('html, body').animate({
            scrollTop: (position + velocity)
        }, 40);
    }
    else if (direction === 'down') {
        $('html, body').animate({
            scrollTop: (position - velocity)
        }, 40);
    }
  })
}
onScroll(70);

另外，代码可以简化，为了清晰起见，我没有明智地这样做

live example