zoukankan      html  css  js  c++  java
  • 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();
                }
            })
    View Code

    这里需要动态获取两个iscroll的高度

            $(".bigScroll").height($("body").height()-$("header").height());
            //这里了的48是要保留的高度,这里既是nav的高度,可以试着改变这里的值,
            $(".smallScroll").height($("body").height()-48-$("header").height());
    scroll()是下拉刷新方法,不用的可以去掉

    最后放上源码

    下载

  • 相关阅读:
    获取和设置iframe中的元素
    css隔行换色样式修改
    在本地打开网页
    HTML-embed标签详解
    GlusterFS缺点分析[转]
    设计新Xlator扩展GlusterFS[转]
    C语言:全局变量在多个c文件中公用的方法 [转]
    const char*, char const*, char*const的区别
    C 语言字符数组的定义与初始化
    滑动窗口机制[转]
  • 原文地址:https://www.cnblogs.com/fengkuangkg/p/iscroll.html
Copyright © 2011-2022 走看看