移动端滑动隐藏头部

Question

上午已提出了这个问题了，当时以为解决了，方案如下：

window.onload = function () {
            var u = navigator.userAgent;
            if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
                window.addEventListener('scroll',function(){
                  window.scrollY >=h?vm.headShow = true:vm.headShow = false;
                })
            } else if (u.indexOf('iPhone') > -1) {//苹果手机
                var startY = '';
                window.addEventListener('touchstart', function (e) {
                    startY = e.touches[0].pageY
                })
                window.addEventListener('touchmove', function (e) {
                    var endY = e.changedTouches[0].pageY;
                    var cy = endY-startY;
                    console.log(cy);
                    if(cy>=0){
                        vm.headShow = false;
                    }else if(cy<0){
                        cy <-h?vm.headShow = true:vm.headShow = false;
                    }
                }, false)
            }
        }

在chrome上调试，可以实现，结果一上苹果手机就失败没效果，网上有很多关于这个情况的帖子，本网站也有不少，如：移动端onscroll事件在部分浏览器失效

。但是仍然没有可行的办法，最后发现mui这个插件的nav-transparent效果能满足我的需求，可是悲剧的是，mui.min.js代码实在是看得人范晕（因为项目已用了其他的插件，不能为这一个效果而再单独引用一个插件，只能自己写），有没有熟悉这款插件的帮忙解释一下他是如何实现的？