IScroll5不能滑到最底端的解决办法

IScroll整体上用起来比较简单,可是若是用很差的可能会产生底部一点滚动不上去的问题。css

环境:weui+iscroll5ajax

总体布局及id以下app

searchbar
wrapper
   divscroll布局

window.onload = function () {
    FillList();
}
function FillList() {
    try {if (myScroll == undefined || myScroll == null) loadedsroll();
        else myScroll.refresh();
    }
    catch (e) {
    }
}
var myScroll = null;
var wrapperheight = 0;
var isMore = false;   //是否可刷新标记
var pageIndex = 1;
var pageSize = 10;
//加载Iscroll
function loadedsroll() {
    setTimeout(function () {
        myScroll = new IScroll('#wrapper', { click: true });
        myScroll.on('scrollStart', function () {
            document.activeElement.blur();
        });
        myScroll.on('scrollEnd', function () {
            var temp_height = 0;
            temp_height = $("#wrapper").height();
            try {
                var hwindow = (window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight)- $('#searchBar').height();
                if (temp_height > hwindow)
                    temp_height = hwindow;
            }
            catch (e) { }
            $("#wrapper").height(temp_height);
            $("#divscroll").css("min-height", temp_height + 1);
            if (this.y <= this.maxScrollY) {
                if (isMore == false) {
                    $("#divscroll").height("");this.refresh();
                    return;
                }
                pageIndex = pageIndex + 1;
                FillList();
                this.refresh()
            } else {
                this.refresh()
            }
        });
    }, 100);
}

按上面的写法通常没有问题,支持ajax加载,只要把要加载的数据放到FillList中便可,如下内容是关键,不注意的话,divscroll内部元素底部会被挡一部分。post

一、以前经过设置divscroll当前高度+一个额外高度解决,但有时加固定高度偏差比较大,滑动到底部会有额外一段空白,用户体验很差。测试

二、开发者模式能够看到是总高度不对,即便设置内部元素margin也不行。ui

三、尝试使用网上说的加载完毕后refresh无效。this

经过测试研究有两种解决办法:spa

一、设置postion:abolute;code

二、设置#divscroll元素的padding-bottom:1px,设为0不起做用,设置1px便可。

#divscroll {
    position: absolute;
    width: 100%;
}

 或者

#divscroll {
    padding-bottom:1px;
}

 实际项目中处理先后滚动到最底部时的效果(PS:虽然解决了,但不明白什么缘由形成了这个问题,哪位同窗若是知道的话请指点下。)

相关文章
相关标签/搜索