jScrollPane scrolling amount
jScrollPane scrolling amount
我正在使用jScrollPane并试图找出如何获取滚动量。基本上我想知道用户何时到达滚动底部,以便我可以触发另一个函数。这是我的函数:
in_page_scroll : function() {
"use strict";
var inpage_container = $('.pal_inpage_wrapper'),
inpage_top_padd = $('.header_wrapper').height(),
win_main_height = $(window).height() - inpage_top_padd;
inpage_container.css({
height: win_main_height,
marginTop: inpage_top_padd,
paddingTop: 0}).jScrollPane({
autoReinitialise: true,
enableKeyboardNavigation : true
}).bind('mousewheel', function(e) {
e.preventDefault();
});
}
提前谢谢。
--*编辑*-----------------------------------------------------------------------------------
我刚刚找到了答案。在这里:
$(function() {
var element = $('.scroll-pane').jScrollPane(),
api = element.data('jsp');
$('.scroll-pane').bind('scroll', function() {
if($('.scroll-pane').outerHeight() + api.getContentPositionY() >= api.getContentHeight()) {
//Fire another function here
}
});
});
只是为了给出一个推荐和一个时尚的完成,我用这个:
.JS $('#jScrollPane').bind( 'jsp-scroll-y', function(event, scrollPositionY, isAtTop, isAtBottom) { if(scrollPositionY> 0) { $(this).addClass('ShadowTOP') } if(isAtTop) { $(this).removeClass('ShadowTOP') } } ).jScrollPane()
我添加了过渡效果。效果将类似于GMail。
风格 .过渡阴影{ 过渡:所有 0.35s 缓入; -webkit过渡:所有0.35s缓入; -MOZ 过渡:所有 0.35s 缓入; } .影顶{ -webkit-box-shadow: inset 0px 12px 16px -10px rgba(100, 100, 100, 0.3); 框阴影:内嵌 0px 10px 16px -10px RGBA(100, 100, 100, 0.3); }
相关文章:
- Scrolling jQuery
- While Scrolling:如果scrollTop()等于或达到一个值,则执行事件
- 任何应用“webkit-overflow-scrolling: touch”与javascript内联的方法
- Bootstrap Sidebar Scrolling, Affix & Scrollspy
- ngAnchorScroll not scrolling
- jScrollPane scrolling amount
- -webkit-overflow-scrolling 打破绝对定位
- 如何在jquery ajax模板中添加两个不同的绑定变量(如${amount}和${tax})的值
- 使用AngularJS数据表中的Scrolling按需加载数据
- 如何使用此正则表达式接受amount textfield的负值
- Javascript Scrolling
- 为什么smooth scrolling.js抛出了一个"$target.offset(..)未定义”;错误
- Javascript Scrolling Tables
- jquery.mousewheel.js iPhone scrolling
- jQuery -如果left <= 0,设置css为X amount
- 使用-webkit-overflow-scrolling时的当前滚动位置:touch - Safari iOS java
- SproutCore GridView not scrolling
- Rainbow Scrolling Text Using <span>
- scrollTop不能和-webkit-overflow-scrolling: touch一起使用
- 用于amount的Javascript正则表达式