diff --git a/package.json b/package.json index 349dad2..c1189ce 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "babel-preset-env": "^1.6.0", "babel-preset-stage-2": "^6.24.1", "babel-register": "^6.26.0", + "better-scroll": "^1.13.0", "chalk": "^1.1.3", "connect-history-api-fallback": "^1.3.0", "copy-webpack-plugin": "^4.0.1", diff --git a/src/assets/styles/style.css b/src/assets/styles/style.css index eb29360..a03cd38 100644 --- a/src/assets/styles/style.css +++ b/src/assets/styles/style.css @@ -331,6 +331,15 @@ html,body { .f-inb { display: inline-block; } +.weui-toast { + width: 100%; + min-height: 100% !important; + overflow: hidden; + top: 0; +} +.weui-icon_toast.weui-loading { + margin-top: 75%; +} @media (-webkit-min-device-pixel-ratio: 2) { .f-bb-gray::after { height: 1px; diff --git a/src/common/rem.js b/src/common/rem.js index 5170b90..f858838 100644 --- a/src/common/rem.js +++ b/src/common/rem.js @@ -1,13 +1,36 @@ -window.onload = function(){ - /*720代表设计师给的设计稿的宽度,你的设计稿是多少,就写多少;100代表换算比例,这里写100是 - 为了以后好算,比如,你测量的一个宽度是100px,就可以写为1rem,以及1px=0.01rem等等*/ - getRem(750,100) -}; -window.onresize = function(){ - getRem(750,100) -}; -function getRem(pwidth,prem){ - var html = document.getElementsByTagName("html")[0]; - var oWidth = document.body.clientWidth || document.documentElement.clientWidth; - html.style.fontSize = oWidth/pwidth*prem + "px"; -} \ No newline at end of file +(function(win) { + var doc = win.document; + var docEl = doc.documentElement; + var tid; + + function refreshRem() { + var width = docEl.getBoundingClientRect().width; + if (width > 750) { + // 最大宽度 + width = 750; + } + var rem = width / 7.5; + docEl.style.fontSize = Math.round(rem) + "px"; + } + + win.addEventListener( + "resize", + function() { + clearTimeout(tid); + tid = setTimeout(refreshRem, 300); + }, + false + ); + win.addEventListener( + "pageshow", + function(e) { + if (e.persisted) { + clearTimeout(tid); + tid = setTimeout(refreshRem, 300); + } + }, + false + ); + + refreshRem(); +})(window); \ No newline at end of file diff --git a/src/view/goods-classify.vue b/src/view/goods-classify.vue index 5e21051..a13ed03 100644 --- a/src/view/goods-classify.vue +++ b/src/view/goods-classify.vue @@ -3,10 +3,10 @@
商品分类
-
-
+
+ -
-
-

{{item.combinationName}}

-
-
- - - -
-
-

{{goods.name}}

-

{{goods.shortDesc}}

-
{{toJSON(goods.smallLabel)}}
-
-
-

- {{goods.price/100}} -

-

¥{{goods.originalPrice/100}}

-
-
+
+
+
+
+

{{item.combinationName}}

+
+
+ + + +
+
+

{{goods.name}}

+

{{goods.shortDesc}}

+
{{toJSON(goods.smallLabel)}}
+
+
+

+ {{goods.price/100}} +

+

¥{{goods.originalPrice/100}}

+
+
+
-
-
+
+
-
- -
+
@@ -219,11 +194,13 @@ width: 100%; display: flex; height: calc(100vh - 0.9rem); + -webkit-overflow-scrolling: touch; .left { width: 1.74rem; background-color: #F3F3F3; overflow-y: auto; overflow-x: hidden; + -webkit-overflow-scrolling: touch; ul { li { width: 1.74rem; @@ -259,6 +236,7 @@ .right { overflow-y: auto; overflow-x: hidden; + -webkit-overflow-scrolling: touch; padding: 0.2rem 0.22rem 0; width: calc(100% - 1.74rem); box-sizing: border-box; @@ -324,16 +302,4 @@ } } } - .Loading-box { - .weui-toast { - width: 100%; - min-height: 100% !important; - overflow: hidden; - top: 0; - } - .weui-icon_toast.weui-loading { - margin-top: 75%; - } - } - \ No newline at end of file diff --git a/src/view/home.vue b/src/view/home.vue index e99a2d5..2a8aece 100644 --- a/src/view/home.vue +++ b/src/view/home.vue @@ -57,7 +57,7 @@
- +