Ich habe derzeit eine Seite in der folgenden Form
<div id="content"> <div id="content-page-1"> <!--content--> </div> <div id="content-page-2"> <!--content--> </div> </div>
Gibt es eine M?glichkeit zum Scrollen
Jquery verwenden?
我嘗試了不同的插件,但它們都在 mvc 中觸發(fā)多個(gè)事件時(shí)遇到問題,所以我使用 underscore.js 想出了這個(gè)解決方案
<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>
如果您偵聽節(jié)點(diǎn)上的滾動(dòng)事件,您可以輕松使用 之類的插件scrollTo 平滑滾動(dòng)到“下一個(gè) div”或上一個(gè) 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; });