我正在尝试制作一个包含所有事件的滚动触发的整个网站。我只需要帮助来实现这种效果:
- 我有一个网站，其中包含一些填满所有视口(viewport)的 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 滚动到另一个(整页)
我知道有一个名为 fullpage.js 的 jquery 插件，它做得很好，但作为一名学习 Web 开发的学生，使用插件并不是提高我技能的最佳方式。
感谢您的帮助!
干杯西蒙
最佳答案
您为什么会这样认为？ 我怀疑它会比
简单得多$(document).ready(function() {
$('#fullpage').fullpage();
});
插件的作者也很可能已经遇到、考虑并必须解决许多您还没有机会考虑的跨浏览器和非跨浏览器的细节和问题。
编辑::动画 div:
$( "#bigasshorizontaldiv" ).animate({
left: "-=thewidthofoneviewport",
}, 5000, function() {
// Animation complete.
});
关于javascript - jquery滚动垂直/水平，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45969059/