2012-12-05 77 views
2

我的网站上有6个div,每个div的浏览器窗口的高度和宽度相同,因此5个视图,3个左对齐,3个顶部,因此....在锚点上更改滚动方向

enter image description here

当我的访问者滚动,ID喜欢一起到第三格滚动,然后向上滚动到第4位,然后继续水平滚动。这可能与jQuery,如果是的话,它是如何做到的?

回答

1

简单(也许有用)和不完美:

var win = $(window), 
    doc = $(document), 
    bodyH = doc.height() - win.height(), 
    page4 = $('#page4'); 

win.scrollTop(bodyH); 


$(document).on('DOMMouseScroll mousewheel', function(e, delta) { 
    delta = delta || -e.originalEvent.detail/3 || e.originalEvent.wheelDelta/120; 

    if(delta < 0) { 
     if(win.scrollLeft() > page4.offset().left && win.scrollTop() !== 0) { 
      win.scrollTop(win.scrollTop() + delta * 30); 
     } else { 
      win.scrollLeft(win.scrollLeft() - delta * 30); 
     } 
    } else { 
     if(win.scrollLeft() < page4.offset().left && (win.scrollTop() > 0 || win.scrollTop() === 0) && win.scrollTop() !== bodyH) { 
      win.scrollTop(win.scrollTop() + delta * 30); 
     } else { 
      win.scrollLeft(win.scrollLeft() - delta * 30); 
     } 
    } 

    e.preventDefault(); 
}); 

demo

+0

@Liam是你的问题回答了?然后将其标记为原样! – yckart