我正在建立一个这样的网站(几乎是垂直幻灯片放映):
http://mikelegacywebdesign.com/scrollpage_test/index.html
我想要做但我想不通的一件事是如何使滚动捕捉到滚动时颜色变化的点。
例如,滚动时,您会到达下一个要滚动到的颜色顶部附近的大约 50-100 像素处,如果它能捕捉到那个点,而不是继续滚动,那就太好了,因为它很难让那个“框架”完美对齐。这取决于用户滚动的完美数量,以便他们查看完整的帧,而不是序列中前一帧或下一帧的片段。
任何知道是否有 jQuery 插件或其他东西的人都是我的英雄。
这是到目前为止的整个页面。获得当前效果的简单编码:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Scrollpage Test</title>
<style type="text/css">
html, body { margin: 0; padding: 0; height: 100%; width: 100%; }
.container { height: 400%; width: 100%; }
.section { height: 35%; width: 100%; }
#section1 { background-color: #1d9ad7; }
#section2 { background-color: #c83e3d; }
#section3 { background-color: #75b946; }
#section4 { background-color: #f4be2f; }
</style>
</head>
<body>
<div class="container">
<div class="section" id="section1"></div>
<div class="section" id="section2"></div>
<div class="section" id="section3"></div>
<div class="section" id="section4"></div>
</div>
</body>
</html>
最佳答案
关于javascript - 滚动时是否可以执行 "snap-to"效果?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11233586/