Authored by biao

fix flex display issue. code review by LZF

@@ -37,19 +37,28 @@ function hiddenTips($ele) { @@ -37,19 +37,28 @@ function hiddenTips($ele) {
37 } 37 }
38 } 38 }
39 39
40 -function isFlexSupport() {  
41 - var flex = document.createElement('p').style.flex,  
42 - webkitFlex = document.createElement('p').style.webkitFlex,  
43 - flexWrap = document.createElement('p').style.flexWrap;  
44 -  
45 - if ((flex === '' || webkitFlex === '') && flexWrap === '') {  
46 - return true;  
47 - } else {  
48 - return false; 40 +//function isFlexSupport() {
  41 +// var flex = document.createElement('p').style.flex,
  42 +// webkitFlex = document.createElement('p').style.webkitFlex,
  43 +// flexWrap = document.createElement('p').style.flexWrap;
  44 +//
  45 +// if ((flex === '' || webkitFlex === '') && flexWrap === '') {
  46 +// return true;
  47 +// } else {
  48 +// return false;
  49 +// }
  50 +//}
  51 +
  52 +function wrapElements(selector, count) {
  53 + $(selector).each(function(idx, el) {
  54 + if (idx % count === 0) {
  55 + $($(selector).slice(idx, idx + count)).wrapAll($('<div class="js-wraper"></div>'));
49 } 56 }
  57 + });
50 } 58 }
51 59
52 60
  61 +
53 function search() { 62 function search() {
54 if (searching || end) { 63 if (searching || end) {
55 return; 64 return;
@@ -84,9 +93,10 @@ function search() { @@ -84,9 +93,10 @@ function search() {
84 hiddenTips($('#size-swiper-container')); 93 hiddenTips($('#size-swiper-container'));
85 hiddenTips($('#reference-swiper-container')); 94 hiddenTips($('#reference-swiper-container'));
86 95
87 - if (!isFlexSupport()) {  
88 - $('.detail .column').removeClass('column').addClass('oldbox');  
89 - } 96 + //if (!isFlexSupport()) {
  97 + // $('.detail .column').removeClass('column').addClass('oldbox');
  98 + //}
  99 + wrapElements('.detail .column', 2);
90 searching = false; 100 searching = false;
91 end = true; 101 end = true;
92 loading.hideLoadingMask(); 102 loading.hideLoadingMask();
@@ -41,6 +41,7 @@ $basicBtnC:#eb0313; @@ -41,6 +41,7 @@ $basicBtnC:#eb0313;
41 } 41 }
42 42
43 &.table { 43 &.table {
  44 + .js-wraper {
44 @include flexbox(( 45 @include flexbox((
45 display: box, 46 display: box,
46 box-lines: multiple, 47 box-lines: multiple,
@@ -51,6 +52,7 @@ $basicBtnC:#eb0313; @@ -51,6 +52,7 @@ $basicBtnC:#eb0313;
51 flex-wrap: wrap, 52 flex-wrap: wrap,
52 justify-content: flex-start 53 justify-content: flex-start
53 )); 54 ));
  55 + }
54 width: 100%; 56 width: 100%;
55 .column { 57 .column {
56 box-sizing: border-box; 58 box-sizing: border-box;
@@ -85,6 +87,7 @@ $basicBtnC:#eb0313; @@ -85,6 +87,7 @@ $basicBtnC:#eb0313;
85 white-space:nowrap; 87 white-space:nowrap;
86 overflow:hidden; 88 overflow:hidden;
87 } 89 }
  90 +
88 } 91 }
89 } 92 }
90 } 93 }