检测可滚动DIV中的当前位置
使用iScroll4框架，我们可以在触控操作系统上使用兼容的滚动div。另外，我们在两边都有可以跳跃240px onClick的箭头。这适用于不支持CSS3的浏览器。
问题是，当一个人在触摸屏操作系统上滚动，然后按下一个箭头时，它会滚动回到他们这样做之前的位置，然后前进240px。
这是因为iScroll没有向我的全局变量offset提供信息。
我想解决的办法是使用JQuery的.Scroll()方法来确定div何时完成滚动，然后更新全局变量。如何做到这一点则是另一回事。
这是一把小提琴。使用L&R按钮作为向左和向右的箭头，对于那些使用CSS3浏览器的用户，进行一些拖动，然后查看当您按下其中一个按钮时会发生什么。http://jsfiddle.net/Agp74/5/
有没有什么办法来解决这个问题。
太棒了
回答 1
Stack Overflow用户
发布于 2011-06-23 15:39:12
一些小贴士，因为我不得不写一些几乎相同的东西：
如果您有权访问何时调用$.animate()，则可以使用step属性添加函数：http://api.jquery.com/animate/
我构建的滚动条使用了left属性来控制内部div的位置：
<div id="#outside">
<div id="#partThatSlides">Content Content Content ...</div>
</div>我发现我可以通过执行以下两种方法之一来获得当前滑块位置：
var trueLeft = $('#partThatSlides').offset().left - $('#outside').offset().left;或
var trueLeft = parseInt($('#partThatSlides').attr('left'));通过性能测试，我发现第二种方法几乎比第一种方法快20-50倍
编辑：
从你正在使用的插件的源代码看，你可以绑定到这些事件中的一个：
onBeforeScrollStart: function (e) { e.preventDefault(); },
onScrollStart: null,
onBeforeScrollMove: null,
onScrollMove: null,
onBeforeScrollEnd: null,
onScrollEnd: null,
onTouchEnd: null,我猜你可以在那里执行逻辑。
我会将滚动条的构造移到与“全局”(但不是真正的全局)变量相同的闭包作用域中，这样你就有了类似这样的东西：
EDIT2：
下面是可用的代码
$(document).ready(function(){
var myScroll2,
offset = 0;
function scrollHandler() {
if(this.x || this.x === 0) {
offset = this.x
}
};
myScroll2 = new iScroll('bkdates', {
snap: 'div',
useTransform: false,
momentum: false,
hScrollbar: false,
vScrollbar: false,
onScrollMove: scrollHandler,
onScrollEnd: scrollHandler
});
$( '#bkarrowsr' ).mouseup( function() {
offset -= (48 * 5);
if ( offset < -(85 * 48) ) {
offset = -(85 * 48); // don't exceed this limit
}
myScroll2.scrollTo(offset,0,400);
});
$( '#bkarrowsl' ).mouseup( function() {
offset += (48 * 5);
if ( offset > 0 ) {
offset = 0; // don't exceed this limit
}
myScroll2.scrollTo(offset,0,400);
});
});https://stackoverflow.com/questions/6456379
复制相似问题
领取专属 10元无门槛券
AI混元助手 在线答疑
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
