EmmenCao
EmmenCao
  • 发布:2016-11-21 18:50
  • 更新:2016-11-30 10:01
  • 阅读:2775

下拉菜单和mui-bar-transparent 一起不渐变bg的问题

分类:MUI

如图:
是否因为mui的下拉加载改变的是style.transform,无法触发头部渐变。

求解决方案。

2016-11-21 18:50 1 条评论 负责人:无 分享
已邀请:
EmmenCao

EmmenCao (作者)

已按照http://ask.dcloud.net.cn/question/25114 解决

EmmenCao

EmmenCao (作者)

修改了一些,解决了1.判断undefined 错误,2. 重复创建Sroll对象,导致页面卡的问题。
代码:
mui.js 重写:


Transparent.prototype.handleScroll = function () {
if(typeof(this.options.scroller) === "undefined") {
this._style.backgroundColor = 'rgba(' + this._R + ',' + this._G + ',' + this._B + ',' + (window.scrollY - this.options.top) / this.options.offset + ')';
} else {
var sender = mui(this.options.scroller)[0];
var scroller = sender.firstChild;
if(scroller.style.transform != "") {
var scrollTop = Math.abs(parseInt(scroller.style.transform.split(",")[1].replace("px", ""), 10));
this._style.backgroundColor = 'rgba(' + this._R + ',' + this._G + ',' + this._B + ',' + (scrollTop - this.options.top) / this.options.offset + ')';
}
}
};


调用:
mui('.mui-bar-transparent').transparent({
scroller: "#pullrefresh",
offset: 150
});

EmmenCao

EmmenCao (作者)

Transparent.prototype.handleScroll = function () {  
    if(typeof(this.options.scroller) === "undefined") {  
        this._style.backgroundColor = 'rgba(' + this._R + ',' + this._G + ',' + this._B + ',' + (window.scrollY - this.options.top) / this.options.offset + ')';  
    } else {  
        var sender = mui(this.options.scroller)[0];  
        var scroller = sender.querySelector(".mui-scroll");  
        if(scroller.style.transform != "") {  
            var scrollTop = Math.abs(parseInt(scroller.style.transform.split(",")[1].replace("px", ""), 10));  
            this._style.backgroundColor = 'rgba(' + this._R + ',' + this._G + ',' + this._B + ',' + (scrollTop - this.options.top) / this.options.offset + ')';  
        }  
    }  
};

该问题目前已经被锁定, 无法添加新回复