我不确定我是否正确使用它,但我几乎完成了在移动设备上创建粘性元素的解决方法。所以元素在doc流程中然后一旦它到达窗口顶部就会粘到顶部。 Waypoints.js这样做但在移动设备上效果不佳。
到目前为止,我已经能够在桌面上正常工作(并不是什么大不了的事),能够让它在移动触摸滚动(有点大不了)上工作但是如果用户抬起手指并且动量滚动接管,然后事件不会发生,直到动量/滚动停止。
有没有人知道如何在此动量滚动期间触发滚动事件?
这就是我用触摸滚动工作的方法:
var stickyElementPosition = $('#thing-to-be-sticky').offset().top;
$(window).on("touchmove",function(){
var scrollPosition = $('body').scrollTop();
console.log(scrollPosition);
if(scrollPosition >= stickyElementPosition){
$('#thing-to-be-sticky').addClass('stuck');
}
else{
$('#thing-to-be-sticky').removeClass('stuck');
}
});
我做了一个JS小提琴,但我不确定如何在触摸设备上使用它。它只是试图滚动整个页面而不是iframe / result。