Question

我的网站页面中有一个div，它有水平滚动，整个页面都有垂直滚动。当指针在特定部分时，它会停止页面的垂直滚动并启动部分水平滚动。我使用了一个函数。我该如何设置该功能，以便当该部分的水平滚动到达其末尾时，滚动关闭部分和网页滚动开始。我怎样才能实现这一目标？我使用以下函数进行横向滚动： -

 (function() {
    function scrollHorizontally(e) {
        e = window.event || e;
        var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
        document.getElementById('myDIV').scrollLeft -= (delta*40); // Multiplied by 40
        e.preventDefault();
    }
    if (document.getElementById('myDIV').addEventListener) {
        // IE9, Chrome, Safari, Opera
        document.getElementById('myDIV').addEventListener("mousewheel", scrollHorizontally, false);
        // Firefox
        document.getElementById('myDIV').addEventListener("DOMMouseScroll", scrollHorizontally, false);
    } else {
        // IE 6/7/8
        document.getElementById('myDIV').attachEvent("onmousewheel", scrollHorizontally);
    }
})();

Answer 1

使用水平滚动条测量div的宽度，并使用jQuery's .scrollLeft()将其与水平滚动距离进行比较。请记住将div的宽度添加到滚动距离。当两者相等时，滚动到达div的结尾。此时设置一个标志，应该在滚动功能中连续检查 - 标志可以确定div是否应滚动或页面。

Answer 2

 $(window).scroll(function() {   


  if($("#yourdiv").scrollLeft() + $(window).width() == $("#yourdiv").width()) {
     Your code here
   }
});

它应该可以工作，但前提是你的div大于窗口。如果不是，你应该用$（“＃mycontainer”）。width更改$（window）.width（）希望它对你有用，在几乎相似的情况下为我工作，但我不知道你的页面是怎样的。

停止部分的水平滚动并开始页面垂直滚动

2 个答案: