jQuery滚动垂直/水平

Question

我正在尝试制作一个包含滚动触发的所有事件的整个网站。 我只需要帮助即可达到此效果：

我有一个带有几个div且填充了所有视口的网站，我希望用户能够向下滚动到一个命名的div，然后当他继续滚动网站时停止垂直滚动，但div的内容水平滚动。 完成后，网站可以再次垂直滚动。

<body>

<header> </header>

<div class="scroll-vertical" id="tile1"></div>
<div class="scroll-vertical" id="tile2"></div>
<div class="scroll-vertical" id="tile3"></div>

<div class="scroll-horizontal" id="tile4">
    <div class="horizontal" id="tile5"></div>
    <div class="horizontal" id="tile5-a"></div>
    <div class="horizontal" id="tile5-b"></div>
    <div class="horizontal" id="tile5-c"></div>
</div>

<div class="scroll-vertical" id="tile6"></div>
<div class="scroll-vertical" id="tile7"></div>
<footer> </footer>

如何使网站只能从一个div滚动到另一个div（整页）

我知道有一个名为fullpage.js的jquery插件可以很好地完成此工作，但是作为一个学生学习使用插件的Web开发并不是提高我的技能的最佳方法。

谢谢你的帮助！

干杯西蒙

Answer 1

你为什么会假设呢？ 我怀疑它会比简单得多

$(document).ready(function() {
    $('#fullpage').fullpage();
});

该插件的作者很可能已经遇到，考虑并必须解决许多细节和问题，跨浏览器和非浏览器，您还没有机会考虑这些问题。

编辑::动画div：

$( "#bigasshorizontaldiv" ).animate({
    left: "-=thewidthofoneviewport",
    }, 5000, function() {
    // Animation complete.
});

jQuery滚动垂直/水平

问题描述

1 个解决方案

解决方案1
0 2017-08-30 20:53:47

jQuery滚动垂直/水平

问题描述

1 个解决方案

解决方案1 0 2017-08-30 20:53:47

解决方案1
0 2017-08-30 20:53:47