我目前有一个以下形式的页面
<div id="content"> <div id="content-page-1"> <!--content--> </div> <div id="content-page-2"> <!--content--> </div> </div>
有什么办法可以滚动
用jquery?
我尝试了不同的插件,但它们都在 mvc 中触发多个事件时遇到问题,所以我使用 underscore.js 想出了这个解决方案
<script type="text/javascript"> $(document).ready(function () { var isc = _.throttle(function (event) { if ($(window).scrollTop() + $(window).height() > $(document).height() - 200) { if (event.handled !== true) { $.post('@path', function (html) { $('#user-feed').append(html); }); } } }, 300); $(window).scroll(isc); }); </script>
如果您侦听节点上的滚动事件,您可以轻松使用 之类的插件scrollTo 平滑滚动到“下一个 div”或上一个 div(无论您如何定义)。
var prevScrollTop = 0; var $scrollDiv = $('div#content'); var $currentDiv = $scrollDiv.children('div:first-child'); $scrollDiv.scroll(function(eventObj) { var curScrollTop = $scrollDiv.scrollTop(); if (prevScrollTop < curScrollTop) { // Scrolling down: $currentDiv = $currentDiv.next().scrollTo(); } else if (prevScrollTop > curScrollTop) { // Scrolling up: $currentDiv = $currentDiv.prev().scrollTo(); } prevScrollTop = curScrollTop; });
我尝试了不同的插件,但它们都在 mvc 中触发多个事件时遇到问题,所以我使用 underscore.js 想出了这个解决方案
如果您侦听节点上的滚动事件,您可以轻松使用 之类的插件scrollTo 平滑滚动到“下一个 div”或上一个 div(无论您如何定义)。