|
|
|
|
@ -1,49 +1,78 @@
|
|
|
|
|
/*
|
|
|
|
|
* minimobile.js v0.0.1 by chenyaowen
|
|
|
|
|
* 在保留作者签名的情况下，允许使用与商业用途
|
|
|
|
|
* 该文件是一个用于移动端页面布局相关功能的JavaScript代码库，包含了一些处理页面缩放、适配以及常见UI组件功能的代码，例如处理viewport设置、侧栏显示隐藏、返回顶部功能、进度条展示等。
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
// 检查页面是否引入了Zepto.js或者jQuery.js，如果都没引入则在控制台输出提示信息，因为后续代码依赖这两个库之一。
|
|
|
|
|
if (!window.Zepto &&!window.jQuery) {
|
|
|
|
|
console.log("minimobile 是基于Zepto.js 或者 jQuery.js 的，请检查页面是否已在miniMobile之前引入！")
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 立即执行函数，用于创建一个局部作用域，避免全局变量污染，同时接收window对象和一个名为lib的对象（如果不存在则创建一个空对象）作为参数，在函数内部进行相关页面适配等功能的实现。
|
|
|
|
|
;(function (win, lib) {
|
|
|
|
|
//摘自淘宝移动端
|
|
|
|
|
// 获取当前页面的document对象，后续会用于操作页面元素、获取页面相关属性等操作。
|
|
|
|
|
var doc = win.document;
|
|
|
|
|
// 获取页面根元素（<html>元素），很多页面样式和布局相关的设置会基于这个元素来操作，例如设置页面字体大小等属性。
|
|
|
|
|
var docEl = doc.documentElement;
|
|
|
|
|
// 通过选择器查找页面中name属性为"viewport"的meta标签，viewport元标签常用于控制页面在移动端的缩放、布局等显示相关设置。
|
|
|
|
|
var metaEl = doc.querySelector('meta[name="viewport"]');
|
|
|
|
|
// 通过选择器查找页面中name属性为"flexible"的meta标签，从代码逻辑看用于获取一些和页面缩放比例相关的自定义配置信息。
|
|
|
|
|
var flexibleEl = doc.querySelector('meta[name="flexible"]');
|
|
|
|
|
// 用于存储设备像素比（devicePixelRatio）相关的缩放因子，初始化为0，后续会根据不同情况计算并赋值。
|
|
|
|
|
var dpr = 0;
|
|
|
|
|
// 用于存储页面的缩放比例，初始化为0，会根据meta标签内容或者设备类型等情况来确定具体值。
|
|
|
|
|
var scale = 0;
|
|
|
|
|
// 用于存储定时器的标识，在处理页面resize和pageshow等事件时，通过定时器来延迟执行一些操作，避免频繁触发导致性能问题，初始化为null或未定义（取决于JavaScript环境）。
|
|
|
|
|
var tid;
|
|
|
|
|
// 创建一个名为flexible的对象，用于存储页面适配相关的一些属性和方法，如果外部传入的lib对象中已经存在flexible属性，则使用传入的，否则创建一个新的空对象赋值给lib.flexible。
|
|
|
|
|
var flexible = lib.flexible || (lib.flexible = {});
|
|
|
|
|
var designPixel = 750;//设计稿件尺寸
|
|
|
|
|
// 定义设计稿件的尺寸（单位可能是像素），这里设定为750，用于后续根据页面实际宽度计算缩放比例等相关操作，使页面在不同设备上能按比例适配显示。
|
|
|
|
|
var designPixel = 750;
|
|
|
|
|
|
|
|
|
|
// 如果页面中存在name为"viewport"的meta标签，则根据其content属性内容来获取初始缩放比例，并计算出对应的设备像素比（dpr）。
|
|
|
|
|
if (metaEl) {
|
|
|
|
|
console.warn('将根据已有的meta标签来设置缩放比例');
|
|
|
|
|
// 通过正则表达式匹配获取content属性中initial-scale的值，该值表示页面初始缩放比例。
|
|
|
|
|
var match = metaEl.getAttribute('content').match(/initial\-scale=([\d\.]+)/);
|
|
|
|
|
if (match) {
|
|
|
|
|
// 将匹配到的初始缩放比例字符串转换为浮点数赋值给scale变量。
|
|
|
|
|
scale = parseFloat(match[1]);
|
|
|
|
|
// 根据缩放比例计算设备像素比，设备像素比是物理像素与逻辑像素的比例关系，例如scale为0.5，则dpr为2，表示物理像素是逻辑像素的2倍。
|
|
|
|
|
dpr = parseInt(1 / scale);
|
|
|
|
|
}
|
|
|
|
|
} else if (flexibleEl) {
|
|
|
|
|
// 获取name为"flexible"的meta标签的content属性内容，用于进一步解析获取相关缩放比例配置信息。
|
|
|
|
|
var content = flexibleEl.getAttribute('content');
|
|
|
|
|
if (content) {
|
|
|
|
|
// 通过正则表达式匹配尝试获取content属性中initial-dpr的值，用于设置设备像素比（dpr）。
|
|
|
|
|
var initialDpr = content.match(/initial\-dpr=([\d\.]+)/);
|
|
|
|
|
// 通过正则表达式匹配尝试获取content属性中maximum-dpr的值，同样用于设置设备像素比（dpr），可能会覆盖前面initialDpr的设置，取决于具体匹配情况。
|
|
|
|
|
var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/);
|
|
|
|
|
if (initialDpr) {
|
|
|
|
|
// 将匹配到的initial-dpr的值转换为浮点数赋值给dpr变量，用于设置设备像素比。
|
|
|
|
|
dpr = parseFloat(initialDpr[1]);
|
|
|
|
|
// 根据设备像素比计算缩放比例，并保留两位小数，赋值给scale变量。
|
|
|
|
|
scale = parseFloat((1 / dpr).toFixed(2));
|
|
|
|
|
}
|
|
|
|
|
if (maximumDpr) {
|
|
|
|
|
// 同理，如果匹配到了maximum-dpr的值，更新设备像素比（dpr）和缩放比例（scale）。
|
|
|
|
|
dpr = parseFloat(maximumDpr[1]);
|
|
|
|
|
scale = parseFloat((1 / dpr).toFixed(2));
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 如果经过前面的步骤都没有确定dpr和scale的值（即都为0），则根据设备类型（是iPhone还是其他安卓设备等）来设置默认的设备像素比（dpr）和缩放比例（scale）。
|
|
|
|
|
if (!dpr &&!scale) {
|
|
|
|
|
// 通过正则表达式判断当前设备是否为安卓系统。
|
|
|
|
|
var isAndroid = win.navigator.appVersion.match(/android/gi);
|
|
|
|
|
// 通过正则表达式判断当前设备是否为iPhone。
|
|
|
|
|
var isIPhone = win.navigator.appVersion.match(/iphone/gi);
|
|
|
|
|
// 获取当前设备的设备像素比，即物理像素与逻辑像素的实际比例关系。
|
|
|
|
|
var devicePixelRatio = win.devicePixelRatio;
|
|
|
|
|
if (isIPhone) {
|
|
|
|
|
// 如果是iPhone设备，根据设备像素比来设置合适的设备像素比（dpr），例如设备像素比大于等于3且之前未设置或设置的dpr大于等于3，则设置dpr为3，以此类推。
|
|
|
|
|
if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
|
|
|
|
|
dpr = 3;
|
|
|
|
|
} else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
|
|
|
|
|
@ -52,12 +81,17 @@
|
|
|
|
|
dpr = 1;
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
// 如果不是iPhone设备（一般为安卓等其他设备），默认设置设备像素比（dpr）为1。
|
|
|
|
|
dpr = 1;
|
|
|
|
|
}
|
|
|
|
|
// 根据设备像素比（dpr）计算缩放比例（scale），两者互为倒数关系。
|
|
|
|
|
scale = 1 / dpr;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 将计算得到的设备像素比（dpr）设置为页面根元素（<html>元素）的data-dpr属性值，方便在CSS等地方通过属性选择器等方式根据不同的设备像素比来应用不同的样式规则。
|
|
|
|
|
docEl.setAttribute('data-dpr', dpr);
|
|
|
|
|
|
|
|
|
|
// 如果页面中不存在name为"viewport"的meta标签，则动态创建一个这样的meta标签，并设置其content属性，用于控制页面的缩放、用户缩放是否可用等显示相关设置，然后将其添加到页面中合适的位置（一般是<head>标签内）。
|
|
|
|
|
if (!metaEl) {
|
|
|
|
|
metaEl = doc.createElement('meta');
|
|
|
|
|
metaEl.setAttribute('name', 'viewport');
|
|
|
|
|
@ -71,20 +105,29 @@
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 定义一个用于刷新页面根元素字体大小（rem单位）的函数，根据页面宽度、设计稿件尺寸以及设备像素比等信息来动态计算并设置根元素的字体大小，实现页面的自适应布局效果。
|
|
|
|
|
function refreshRem() {
|
|
|
|
|
// 获取页面根元素（<html>元素）的可视宽度（不包含滚动条等占据的宽度），单位为像素，后续会基于这个宽度来计算rem值。
|
|
|
|
|
var width = docEl.getBoundingClientRect().width;
|
|
|
|
|
if (width / dpr > designPixel) { //如果分辨率不是1，那么获取的物理宽度应该乘以分辨率，才是最终可用的width
|
|
|
|
|
// 如果设备像素比（dpr）不为1，说明物理像素和逻辑像素不一致，那么需要将获取到的物理宽度乘以设备像素比，得到真正用于计算rem的可用宽度，这样能保证在不同分辨率设备上布局的准确性。
|
|
|
|
|
if (width / dpr > designPixel) {
|
|
|
|
|
width = width * dpr;
|
|
|
|
|
}
|
|
|
|
|
var rem = width / (designPixel/100); //计算最终还原到设计图上的比例，从而设置到文档上
|
|
|
|
|
// 根据设计稿件尺寸（designPixel）和当前页面可用宽度（width）计算rem值，这里是将页面宽度按照设计稿件尺寸等比例缩放，例如设计稿件宽度是750px，页面当前宽度是375px，则rem值会相应变小，实现页面元素按比例缩放显示。
|
|
|
|
|
var rem = width / (designPixel / 100);
|
|
|
|
|
// 将计算得到的rem值设置为页面根元素（<html>元素）的字体大小（单位为px），通过设置根元素字体大小为rem单位，页面中使用rem单位的元素尺寸等会根据根元素字体大小动态变化，从而实现自适应布局。
|
|
|
|
|
docEl.style.fontSize = rem + 'px';
|
|
|
|
|
// 将计算得到的rem值存储到flexible对象和全局的win对象（即window对象）上，方便其他地方可以访问和使用这个rem值，例如用于将px单位转换为rem单位等操作。
|
|
|
|
|
flexible.rem = win.rem = rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 监听页面的resize事件（当页面大小发生改变时触发），当触发该事件时，先清除之前可能存在的定时器（避免重复执行或频繁执行刷新rem的操作），然后设置一个新的定时器，延迟300毫秒后调用refreshRem函数来重新计算并更新页面根元素的字体大小，实现页面在大小改变后的自适应布局调整。
|
|
|
|
|
win.addEventListener('resize', function () {
|
|
|
|
|
clearTimeout(tid);
|
|
|
|
|
tid = setTimeout(refreshRem, 300);
|
|
|
|
|
}, false);
|
|
|
|
|
|
|
|
|
|
// 监听页面的pageshow事件（当页面显示时触发，比如浏览器前进、后退等操作导致页面重新显示时），如果页面是从缓存中加载显示（通过e.persisted判断），同样先清除之前的定时器，再设置新定时器延迟300毫秒调用refreshRem函数来更新页面布局，确保页面在各种显示场景下都能正确自适应。
|
|
|
|
|
win.addEventListener('pageshow', function (e) {
|
|
|
|
|
if (e.persisted) {
|
|
|
|
|
clearTimeout(tid);
|
|
|
|
|
@ -92,17 +135,25 @@
|
|
|
|
|
}
|
|
|
|
|
}, false);
|
|
|
|
|
|
|
|
|
|
// 如果页面已经加载完成（document.readyState为'complete'），则直接设置页面body元素的字体大小为16乘以设备像素比（dpr）的像素值，这是一种基础的字体大小设置，通常配合rem单位的自适应布局使用，确保文字显示大小合适。
|
|
|
|
|
if (doc.readyState === 'complete') {
|
|
|
|
|
doc.body.style.fontSize = 16 * dpr + 'px';
|
|
|
|
|
} else {
|
|
|
|
|
// 如果页面还未加载完成，则监听DOMContentLoaded事件（当页面DOM结构加载完成但可能资源（如图片等）还未完全加载时触发），在该事件触发时设置页面body元素的字体大小，同样为16乘以设备像素比（dpr）的像素值。
|
|
|
|
|
doc.addEventListener('DOMContentLoaded', function (e) {
|
|
|
|
|
doc.body.style.fontSize = 16 * dpr + 'px';
|
|
|
|
|
}, false);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 首次加载页面时调用refreshRem函数，初始化页面根元素的字体大小，确保页面一开始就能以正确的自适应布局显示。
|
|
|
|
|
refreshRem();
|
|
|
|
|
|
|
|
|
|
// 将计算得到的设备像素比（dpr）存储到flexible对象和全局的win对象（即window对象）上，方便其他地方获取和使用设备像素比信息，例如在处理高清图片显示等场景下可能会用到。
|
|
|
|
|
flexible.dpr = win.dpr = dpr;
|
|
|
|
|
// 将refreshRem函数存储到flexible对象上，方便外部可以手动调用该函数来刷新页面的rem值，实现手动触发页面自适应布局调整，例如在某些动态改变页面布局结构的情况下可以使用。
|
|
|
|
|
flexible.refreshRem = refreshRem;
|
|
|
|
|
|
|
|
|
|
// 定义一个方法用于将rem单位的数值转换为px单位的数值，接收一个参数d（可以是数字或者以rem结尾的字符串），先将其转换为浮点数，然后乘以当前的rem值（通过this.rem获取，this指向flexible对象），如果传入的参数是字符串且以rem结尾，则在返回结果后面加上'px'单位，方便在样式设置等场景下直接使用。
|
|
|
|
|
flexible.rem2px = function (d) {
|
|
|
|
|
var val = parseFloat(d) * this.rem;
|
|
|
|
|
if (typeof d === 'string' && d.match(/rem$/)) {
|
|
|
|
|
@ -110,6 +161,8 @@
|
|
|
|
|
}
|
|
|
|
|
return val;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 定义一个方法用于将px单位的数值转换为rem单位的数值，接收一个参数d（可以是数字或者以px结尾的字符串），先将其转换为浮点数，然后除以当前的rem值（通过this.rem获取，this指向flexible对象），如果传入的参数是字符串且以px结尾，则在返回结果后面加上'rem'单位，方便在样式设置等场景下直接使用，例如在根据设计稿尺寸计算元素的rem单位尺寸时会用到。
|
|
|
|
|
flexible.px2rem = function (d) {
|
|
|
|
|
var val = parseFloat(d) / this.rem;
|
|
|
|
|
if (typeof d === 'string' && d.match(/px$/)) {
|
|
|
|
|
@ -119,114 +172,40 @@
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
})(window, window['lib'] || (window['lib'] = {}));
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
* asideUi 侧栏
|
|
|
|
|
* 以下代码定义了一个名为asideUi的jQuery或Zepto插件（取决于页面引入的是哪个库），用于创建一个具有特定交互效果的侧边栏组件，例如可以通过点击切换侧边栏的显示隐藏状态，并且可以配置一些属性如大小、是否显示遮罩、位置以及动画过渡时间等。
|
|
|
|
|
*/
|
|
|
|
|
;
|
|
|
|
|
(function ($) {
|
|
|
|
|
// 通过$.fn向jQuery或Zepto的原型对象上添加一个名为asideUi的方法，这样就可以在选择器选中的元素上调用该方法来创建侧边栏组件实例，接收一个options参数用于传入配置选项。
|
|
|
|
|
$.fn.asideUi = function (options) {
|
|
|
|
|
// 定义默认的配置选项对象，包含侧边栏的大小（默认为'100%'，可以是具体的宽度值或者百分比等）、是否显示遮罩（默认为true）、显示位置（默认为'left'，还可以是'right'、'bottom'等）以及侧边栏展开收起的动画过渡时间（默认为300毫秒）。
|
|
|
|
|
var defaults = {
|
|
|
|
|
size: '100%',
|
|
|
|
|
hasmask: true,
|
|
|
|
|
position: 'left',
|
|
|
|
|
sidertime: 300
|
|
|
|
|
};
|
|
|
|
|
// 使用$.extend方法将传入的options参数与默认的配置选项defaults进行合并，返回合并后的配置对象，这样既可以使用默认配置，又可以通过传入的参数覆盖部分默认配置。
|
|
|
|
|
var val = $.extend(defaults, options);
|
|
|
|
|
var obj = function() {},
|
|
|
|
|
_self = this,
|
|
|
|
|
thisMask = $("<div class='ui-aside-mask'></div>"),
|
|
|
|
|
thisCss = {},
|
|
|
|
|
thisCss2 = {};
|
|
|
|
|
// 创建一个空的函数对象，后续会在这个对象上添加一些方法用于操作侧边栏的显示隐藏等功能，目前只是一个占位，方便代码组织和扩展。
|
|
|
|
|
var obj = function () { };
|
|
|
|
|
// 将当前调用asideUi方法的jQuery或Zepto对象（即选中的元素集合）赋值给_self变量，方便在后续代码中引用，例如设置选中元素的样式、添加移除类名等操作。
|
|
|
|
|
var _self = this;
|
|
|
|
|
// 创建一个用于作为侧边栏遮罩层的<div>元素，添加一个名为'ui-aside-mask'的类名，后续可以通过CSS样式来设置其外观（如透明度、背景色等）以及交互效果（如点击隐藏侧边栏等）。
|
|
|
|
|
var thisMask = $("<div class='ui-aside-mask'></div>");
|
|
|
|
|
// 创建一个空对象thisCss，用于存储侧边栏的初始样式设置（主要是控制侧边栏的显示位置和隐藏状态相关样式），后续会根据配置的侧边栏位置等信息来设置具体的样式属性。
|
|
|
|
|
var thisCss = {};
|
|
|
|
|
// 创建另一个空对象thisCss2，用于存储侧边栏展开后的样式设置（同样是控制侧边栏的位置相关样式），与thisCss相对应，用于在侧边栏切换显示隐藏时应用不同的样式实现动画过渡效果。
|
|
|
|
|
var thisCss2 = {};
|
|
|
|
|
|
|
|
|
|
// 根据配置的侧边栏位置（val.position），设置侧边栏的初始位置样式，例如如果位置是'left'，则将其left属性设置为负的侧边栏大小（val.size），实现将侧边栏隐藏在屏幕左侧的效果（通过CSS的left属性负值来隐藏元素），其他位置同理。
|
|
|
|
|
thisCss[val.position] = '-' + val.size;
|
|
|
|
|
// 设置侧边栏的top和bottom属性，根据侧边栏的显示位置（val.position）来决定top属性是否自动（如果是'bottom'位置则top为'auto'，其他位置top为0），同时设置bottom属性为0，用于控制侧边栏在垂直方向上的定位。
|
|
|
|
|
this.css({
|
|
|
|
|
'top': (val.position == "bottom")? "auto" : 0,
|
|
|
|
|
'bottom': 0
|
|
|
|
|
});
|
|
|
|
|
thisCss2[val.position] = 0;
|
|
|
|
|
_self.css(thisCss);
|
|
|
|
|
|
|
|
|
|
obj.toggle = function() {
|
|
|
|
|
if(_self.hasClass('ui-aside-open')) {
|
|
|
|
|
_self.removeClass('ui-aside-open');
|
|
|
|
|
_self.animate(thisCss, val.sidertime);
|
|
|
|
|
$('.ui-aside-mask').animate({
|
|
|
|
|
'opacity': 0
|
|
|
|
|
}, 100, function() {
|
|
|
|
|
$(this).remove();
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
_self.addClass('ui-aside-open');
|
|
|
|
|
_self.animate(thisCss2, val.sidertime);
|
|
|
|
|
if(val.hasmask) {
|
|
|
|
|
$('body').append(thisMask);
|
|
|
|
|
$(".ui-aside-mask").animate({
|
|
|
|
|
'opacity': 1
|
|
|
|
|
}, 100);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
thisMask.tap(function() {
|
|
|
|
|
obj.toggle();
|
|
|
|
|
})
|
|
|
|
|
return obj;
|
|
|
|
|
};
|
|
|
|
|
})(window.Zepto || window.jQuery)
|
|
|
|
|
/*
|
|
|
|
|
* 返回顶部
|
|
|
|
|
*/
|
|
|
|
|
function goTop(acceleration, time) {
|
|
|
|
|
acceleration = acceleration || 0.1;
|
|
|
|
|
time = time || 16;
|
|
|
|
|
var x1 = 0;
|
|
|
|
|
var y1 = 0;
|
|
|
|
|
var x2 = 0;
|
|
|
|
|
var y2 = 0;
|
|
|
|
|
var x3 = 0;
|
|
|
|
|
var y3 = 0;
|
|
|
|
|
if(document.documentElement) {
|
|
|
|
|
x1 = document.documentElement.scrollLeft || 0;
|
|
|
|
|
y1 = document.documentElement.scrollTop || 0;
|
|
|
|
|
}
|
|
|
|
|
if(document.body) {
|
|
|
|
|
x2 = document.body.scrollLeft || 0;
|
|
|
|
|
y2 = document.body.scrollTop || 0;
|
|
|
|
|
}
|
|
|
|
|
var x3 = window.scrollX || 0;
|
|
|
|
|
var y3 = window.scrollY || 0;
|
|
|
|
|
// 滚动条到页面顶部的水平距离
|
|
|
|
|
var x = Math.max(x1, Math.max(x2, x3));
|
|
|
|
|
// 滚动条到页面顶部的垂直距离
|
|
|
|
|
var y = Math.max(y1, Math.max(y2, y3));
|
|
|
|
|
// 滚动距离 = 目前距离 / 速度, 因为距离原来越小, 速度是大于 1 的数, 所以滚动距离会越来越小
|
|
|
|
|
var speed = 1 + acceleration;
|
|
|
|
|
window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));
|
|
|
|
|
// 如果距离不为零, 继续调用迭代本函数
|
|
|
|
|
if(x > 0 || y > 0) {
|
|
|
|
|
var invokeFunction = "goTop(" + acceleration + ", " + time + ")";
|
|
|
|
|
window.setTimeout(invokeFunction, time);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
* ui-progress进度条
|
|
|
|
|
*/
|
|
|
|
|
;
|
|
|
|
|
(function($) {
|
|
|
|
|
$.fn.progressUi = function(options) {
|
|
|
|
|
var defaults = {
|
|
|
|
|
skin: ''
|
|
|
|
|
};
|
|
|
|
|
var val = $.extend(defaults, options);
|
|
|
|
|
var attrs = {
|
|
|
|
|
max: this.attr('max') || 0,
|
|
|
|
|
value: this.attr("value") || 0
|
|
|
|
|
},
|
|
|
|
|
doms = $('<div class="ui-progressBox"></div>');
|
|
|
|
|
domsContent = $('<div class="progress-content ' + val.skin + '"></div>');
|
|
|
|
|
this.wrap(doms);
|
|
|
|
|
domsContent.animate({
|
|
|
|
|
'width': attrs.value / attrs.max * 100 + '%',
|
|
|
|
|
});
|
|
|
|
|
doms.prepend(domsContent);
|
|
|
|
|
};
|
|
|
|
|
})(window.Zepto || window.jQuery)
|
|
|
|
|
});}})
|
|
|
|
|
// 根据
|
