iscroll双重滚动,向上滚动隐藏一部分,下拉后显示
最近项目需求:下面是页面,当用户向上滚动时候,【隐藏的】部分也向上滚动直至消失,这时候【标题】和【搜索框】在最顶部,而【内部的】可以继续滚动,而当【内部的】滚动到最顶部时候,也就是【这个是内部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()是下拉刷新方法,不用的可以去掉
最后放上源码
iscroll双重滚动,向上滚动隐藏一部分,下拉后显示的更多相关文章
- 代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)
代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...
- extjs combobox 设置下拉时显示滚动条 设置显示条数
extjs在点击下拉时如果没有限制它的高度,那么它的默认最大高度是300,显示的时候就会显示300的高度,知道选项内容超过这个高度时才会自动显示滚动条,往往在有些时候我们希望让combobox显示一个 ...
- Bootstrap Flat UI的select下拉框显示不出来 问题解决
Bootstrap Flat UI的select下拉框显示不出来?看这里,恰巧今天我也遇到了这个问题: 点击Messages后并没有出现下拉列表,然而官网的index.html却能显示出来. 经过一番 ...
- WPF{ComboBox绑定类对象, 下拉列显示的值,与取到的值}
DisplayMemberPath 是用来显示下拉列表的值 SelectedValuePath是用来取得选中项的值. ComboBox绑定类对象, 下拉列显示的值,与取到的值 string. Join ...
- web自动化,下拉滚动到底部/顶部和下拉滚动到指定的元素
在web自动化,经常会遇到页面显示内容太多的时候,页面就会出现滚动条,一般有两种方式进行下拉,一种是直接下拉到底部/顶部/中部,或者直接给定元素,直接下拉到指定元素的位置. 两种方式的共同点: 两种方 ...
- RecyclerView上拉隐藏Toolbar,下拉显示
RecyclerView下拉隐藏Toolbar,上拉显示效果图 先说个事:最近我准备做个开源的博客园android客户端!符合Google最新的material design设计风格的!不知道有没有小 ...
- select框默认样式去除(ie中隐藏默认下拉图标)
html代码 <select class="info-select"> <option selected="selected">1< ...
- 隐藏AutoCompleteTextView下拉框的滚动条
最近做项目需要用到AutoCompleteTextView这个控件,而其下拉框的滚动条有点难看,于是想去掉.走了些弯路,终于弄通了. 首先先介绍一种不靠谱的方法:反射机制 为什么会有人想到用这个呢? ...
- -第2章 JS方法实现下拉菜单显示和隐藏
知识点 onmouseover 鼠标经过 onmouseout 鼠标移出 function 关键字 getElementsByTagName 获取一组标签 length 获取对象成员个数 思路 给一级 ...
随机推荐
- ReadMe.md MarkDown file
MarkDown 文件写法类似写Confluence page. http://blog.csdn.net/kaitiren/article/details/38513715
- LUA5.3的BNF范式学习笔记
BNF巴科斯范式 {A} 表示 0 或多个 A , [A] 表示一个可选的 A chunk ::= block block ::= {stat} [retstat] stat ::= ‘;’ ...
- Could not find a getter for id in class 的异常
检查.hbm.xml里边的id是否大小写一致
- IE环境下判断IE版本的语句...[if lte IE 6]……[endif][if lte IE 7]……[endif]
<!--[if IE 6]> <![endif]--> 只有IE6版本可见 <!--[if lte IE 6]> <![endif]--> IE6及其以 ...
- .net实现webservice简单实例分享
原理:WebService是一个SOA(面向服务的编程)的架构,它是不依赖于语言,不依赖于平台,可以实现不同的语言间的相互调用,通过Internet进行基于Http协议的网络应用间的交互.作用:主要用 ...
- jQuery 获取当前节点的html包含当前节点的方法
在开发过程中,jQuery.html() 是获取当前节点下的html代码,并不包含当前节点本身的代码,然后我们有时候确需要,找遍jQuery api文档也没有任何方法可以拿到. 看到有的人通过pare ...
- Linux超快速安装Ruby on Rails
Linux超快速安装Ruby on Rails 时间 2014-11-25 11:45:11 Flincllck Talk 原文 http://www.flincllck.com/quick-ins ...
- hdu 3839 Ancient Messages (dfs )
题目大意:给出一幅画,找出里面的象形文字. 要你翻译这幅画,把象形文字按字典序输出. 思路:象形文字有一些特点,分别有0个圈.1个圈.2个圈...5个圈.然后dfs或者bfs,就像油井问题一样,找出在 ...
- 【转载】调试利器 autoexp.dat
转载:http://www.cppblog.com/flyinghare/archive/2010/09/27/127836.html autoexp.dat入门(调试时自定义变量显示) VC在调试状 ...
- 在Visual Studio 中开发自定义脚手架 Scaffolder
1.官方简单教程 http://blogs.msdn.com/b/webdev/archive/2014/04/03/creating-a-custom-scaffolder-for-visual-s ...