Tho*_*mas 6 javascript jquery iscroll4
更新:我能够让我的卷轴按照需要工作,但我觉得我已经破解了实际问题并且如果有人有更稳固的答案我会喜欢它,我已经更新并在新jQuery下面的片段中注明了我'使用.
我正在使用iScroll-4(http://cubiq.org/iscroll-4)用于iPad/Android网络应用程序,所有内容都与滑动和滚动完美配合,但我在应用程序开头有一个目录允许用户跳转到滚动条的特定区域 -
我正在使用iScroll功能scrollToElement(element, duration)
跳转到不同的区域.还scrollToPage(page, duration)
允许用户一次手动向前和向后导航一页.
在currPageX
我使用该scrollToPage
功能导航时以及当我滑动时观察控制台记录变量更新,但是当使用scrollToElement
该currPageX
变量时不更新.
因此,如果我跳转到一个元素然后向前导航scrollToPage('next', 0)
它将向后移动并导航到目录之后的下一页.
我之前尝试过使用该scroll.refresh()
函数scrollToElement
,之后将函数置于超时等状态,我无法弄清楚为什么currPageX
不更新.
这是我使用两个不同函数的jQuery代码片段:
// TO NAVIGATE FORWARD AND BACKWARDS
$('span.control').on('click', function() {
var slideDir = $(this).attr('data-dir');
if (slideDir == 'prev') {
var tehPg = tehScroll.currPageX-1;
} else if (slideDir == 'next') {
var tehPg = tehScroll.currPageX+1;
}
tehScroll.scrollToPage(tehPg, 0);
return false;
});
// TO JUMP FROM CONTENTS
$('li[data-page="toc"] span').on('click', function() {
var toPage = $(this).attr('data-page');
tehScroll.scrollToElement('li[data-page="'+toPage+'"]', 800);
// ADDED THE FOLLOWING LINE TO MANUALLY SET currPageX after scrolling!
tehScroll.currPageX = $('#slides li[data-page="'+toPage+'"]').index();
return false;
});
Run Code Online (Sandbox Code Playgroud)
您是否考虑过使用jquery-mobile-iscrollview小部件插件?- 有一个函数scrollToPage(pageX, pageY, time),对我来说效果很好......
最好的
中号