最近项目需求:下面是页面,当用户向上滚动时候,【隐藏的】部分也向上滚动直至消失,这时候【标题】和【搜索框】在最顶部,而【内部的】可以继续滚动,而当【内部的】滚动到最顶部时候,也就是【这个是内部1】时候,【隐藏的】也下拉出来
主要是思路是考虑用两个iscroll,一个从【隐藏】部分一直到下面(.bigScroll),一个是包含【内部】的滚动(.smallScroll),当bigScroll滚动的bigScroll.y等于bigScroll.maxScrollY时候,注销bigScroll(bigScroll.disable()),
而当【内部的】smallScroll.y等于0的时候,激活bigScroll(bigScroll.enable);不过这两个判断都是需要在scrollEnd方法里面
代码
bigScroll.on("scrollEnd",function () { // 如果没有scrollEnd事件,么有执行下面的办法,不清楚原因 if(bigScroll.y==bigScroll.maxScrollY){ bigScroll.disable(); } }) smallScroll.on("scrollEnd",function () { // 如果没有scrollEnd事件,么有执行下面的办法,不清楚原因 if(smallScroll.y==0){ bigScroll.enable(); } })
这里需要动态获取两个iscroll的高度
$(".bigScroll").height($("body").height()-$("header").height()); //这里了的48是要保留的高度,这里既是nav的高度,可以试着改变这里的值, $(".smallScroll").height($("body").height()-48-$("header").height());
scroll()是下拉刷新方法,不用的可以去掉
最后放上源码