如图:
是否因为mui的下拉加载改变的是style.transform,无法触发头部渐变。
求解决方案。
如图:
是否因为mui的下拉加载改变的是style.transform,无法触发头部渐变。
求解决方案。
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 (作者)
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 + ')';
}
}
};