原生移动上拉下啦刷新加载更d

来源：互联网发布：东方project mac版编辑：程序博客网时间：2024/06/07 03:39

63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
    color: #FFF;
    border: 0px;
    border-radius: 5px;
    float: right;
    margin: 1.7em 0px;
}
</style>
</head>
<body>
<!--内容显示区-->
<div id="wrapper" style="height:50em;">
  <ul id="gameList">
  </ul>
</div>
<!--JS--> 
<script type="text/javascript">
var upDown=function(opt){
    debugger
    opt = opt || {};
    var ele = opt.ele || 'container';
    var up = opt.up || function(){};
    var down = opt.down || function () {};
    /*上拉刷新和下拉加载*/
    document.getElementById(ele).onscroll=function(){
        var scrollTop =this.scrollTop; //滚动条距离顶部的高度   ——窗口滚动距离
        var ziHeight = this.scrollHeight;   //当前页面的总高度                  
        var fuHeight = this.clientHeight;           //当前可视的页面高度
        if(scrollTop + fuHeight +50 >= ziHeight) { //距离顶部+当前高度 >=文档总高度 即代表滑动到底部
            up();
        } else if(scrollTop <= 50) { //滚动条距离顶部的高度小于等于0

标签：

原生js
移动端
上拉加载下拉刷

阅读全文

0 0