最近项目需求:下面是页面,当用户向上滚动时候,【隐藏的】部分也向上滚动直至消失,这时候【标题】和【搜索框】在最顶部,而【内部的】可以继续滚动,而当【内部的】滚动到最顶部时候,也就是【这个是内部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双重滚动,向上滚动隐藏一部分,下拉后显示的更多相关文章

  1. 代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)

    代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...

  2. extjs combobox 设置下拉时显示滚动条 设置显示条数

    extjs在点击下拉时如果没有限制它的高度,那么它的默认最大高度是300,显示的时候就会显示300的高度,知道选项内容超过这个高度时才会自动显示滚动条,往往在有些时候我们希望让combobox显示一个 ...

  3. Bootstrap Flat UI的select下拉框显示不出来 问题解决

    Bootstrap Flat UI的select下拉框显示不出来?看这里,恰巧今天我也遇到了这个问题: 点击Messages后并没有出现下拉列表,然而官网的index.html却能显示出来. 经过一番 ...

  4. WPF{ComboBox绑定类对象, 下拉列显示的值,与取到的值}

    DisplayMemberPath 是用来显示下拉列表的值 SelectedValuePath是用来取得选中项的值. ComboBox绑定类对象, 下拉列显示的值,与取到的值 string. Join ...

  5. web自动化,下拉滚动到底部/顶部和下拉滚动到指定的元素

    在web自动化,经常会遇到页面显示内容太多的时候,页面就会出现滚动条,一般有两种方式进行下拉,一种是直接下拉到底部/顶部/中部,或者直接给定元素,直接下拉到指定元素的位置. 两种方式的共同点: 两种方 ...

  6. RecyclerView上拉隐藏Toolbar,下拉显示

    RecyclerView下拉隐藏Toolbar,上拉显示效果图 先说个事:最近我准备做个开源的博客园android客户端!符合Google最新的material design设计风格的!不知道有没有小 ...

  7. select框默认样式去除(ie中隐藏默认下拉图标)

    html代码 <select class="info-select"> <option selected="selected">1< ...

  8. 隐藏AutoCompleteTextView下拉框的滚动条

    最近做项目需要用到AutoCompleteTextView这个控件,而其下拉框的滚动条有点难看,于是想去掉.走了些弯路,终于弄通了. 首先先介绍一种不靠谱的方法:反射机制 为什么会有人想到用这个呢? ...

  9. -第2章 JS方法实现下拉菜单显示和隐藏

    知识点 onmouseover 鼠标经过 onmouseout 鼠标移出 function 关键字 getElementsByTagName 获取一组标签 length 获取对象成员个数 思路 给一级 ...

随机推荐

  1. C#模拟Http与Https请求框架实例

    using System.Text; using System.Net; using System.IO; using System.Text.RegularExpressions; using Sy ...

  2. linux------------centos防火墙

    CentOS7默认的防火墙不是iptables,而是firewalle. 你可以用rpm -qa | grep iptables来查看,一般会出现两个一个是iptables 另一个是iptables. ...

  3. 总结ThinkPHP使用技巧经验分享(一)

    约定:1.所有类库文件必须使用.class.php作为文件后缀,并且类名和文件名保持一致2.控制器的类名以Action为后 缀3.模型的类名以Model为后缀,类名第一个字母须大写4.数据库表名全部采 ...

  4. web前端基础知识 - Django进阶

    1. 路由系统 1.1 单一路由对应 url(r'^index$', views.index), 1.2 基于正则的路由 url(r'^index/(\d*)', views.index), url( ...

  5. Android Activity 管理 (AppManager)(非原创)

    AppManager 类: /** * 应用程序Activity管理类:用于Activity管理和应用程序退出 *  */ public class AppManager {     private ...

  6. Unit01: JAVA开发环境

    Top JAVA开发环境 1. JAVA开发环境 1.1. 认识Linux操作系统 1.1.1. Linux的由来及发展 Linux起源于1991年,1995年流行起来,大家可以看到旁边的这个人,它就 ...

  7. java实现甘特图的2种方法:SwiftGantt和Jfree (转)

    http://blog.sina.com.cn/s/blog_50a7c4a601009817.html 第一种方法使用SwiftGantt实现甘特图(进度图推荐这个)   import java.a ...

  8. lisp等

             

  9. AutoHotkey 使用笔记

    注意事项 为了支持中文需安装 AutoHotkey_L Notepad2对ahk代码高亮和折叠支持良好,SciTE则能够提供输入提示 绿色版*.ahk关联AutoHotkey.exe就能双击运行 Au ...

  10. C语言 06 指针

    int *p; //第一个*是象征意义. p = &a; 等价于 int *p = &a; //第二个*是不正确的 *p = &a; //第三个*是访问指针变量指向的存储空间. ...