小箭头 js

@@ -66,7 +66,7 @@ exports.init = function() {
                 thumbContainer
                 thumbContainer
                     .addClass('fixed-bottom')
                     .addClass('fixed-bottom')
                     .removeClass('static');
                     .removeClass('static');
-            } else if (sTop <= containerTop - wH + tContainerH) {
+            } else if (sTop <= containerTop) {
                 thumbContainer
                 thumbContainer
                     .addClass('static')
                     .addClass('static')
                     .removeClass('fixed-bottom fixed-top');
                     .removeClass('fixed-bottom fixed-top');
@@ -94,5 +94,24 @@ exports.init = function() {
         if ($(document).scrollTop() === 0) {
         if ($(document).scrollTop() === 0) {
             $(document).scroll();
             $(document).scroll();
         }
         }
+
+        //计算小箭头位置
+        (function (doc, win) {
+                var docEl = doc.documentElement,
+                    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
+                    arrowPosition = function () {
+                        var clientWidth = docEl.clientWidth;
+                        if (!clientWidth) {
+                            return;
+                        }
+                        docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
+                    };
+
+                if (!doc.addEventListener) {
+                    return;
+                }
+                win.addEventListener(resizeEvt, arrowPosition, false);
+                doc.addEventListener('DOMContentLoaded', arrowPosition, false);
+            })(document, window);
     });
     });
 };
 };

@@ -7,16 +7,17 @@ $pxConvertRem : 40;
 
 
     /*container脱离文本流时占位用，指定高度为内部所有内容高度*/
     /*container脱离文本流时占位用，指定高度为内部所有内容高度*/
     .container-fixed-pos {
     .container-fixed-pos {
-        height: 175rem / $pxConvertRem;
+        height: 195rem / $pxConvertRem;
         margin-left: -15rem / $pxConvertRem;
         margin-left: -15rem / $pxConvertRem;
+        
     }
     }
 
 
     .thumb-container {
     .thumb-container {
         font-size: 0;
         font-size: 0;
-        padding: 20rem / $pxConvertRem 0 0 20rem / $pxConvertRem; /*修改padding-bottom时请修正.container-fixed-pos高度*/
-        background: #fff;
+        padding: 30rem / $pxConvertRem 0 0 30rem / $pxConvertRem; /*修改padding-bottom时请修正.container-fixed-pos高度*/
         z-index: 10;
         z-index: 10;
-        border-bottom: 1px solid #b0b0b0;
+        background: url('../img/thumb-container-bg.png') no-repeat -72rem / $pxConvertRem bottom;
+        background-size: 200% 100%;
 
 
         &.fixed-top {
         &.fixed-top {
             position: fixed;
             position: fixed;
@@ -48,7 +49,7 @@ $pxConvertRem : 40;
             display: inline-block;
             display: inline-block;
             position: relative;
             position: relative;
             margin-right: 22rem / $pxConvertRem;
             margin-right: 22rem / $pxConvertRem;
-            padding-bottom: 20rem / $pxConvertRem;  /*修改padding-bottom时请修正.container-fixed-pos高度*/
+            padding-bottom: 30rem / $pxConvertRem;  /*修改padding-bottom时请修正.container-fixed-pos高度*/
 
 
             &:last-child {
             &:last-child {
                 margin-right: 0;
                 margin-right: 0;

@@ -6,7 +6,6 @@
                     <li class="thumb">
                     <li class="thumb">
                         <img class="thumb-img lazy" data-original="{{thumb}}">
                         <img class="thumb-img lazy" data-original="{{thumb}}">
                         <span class="clothe-type {{type}}"></span>
                         <span class="clothe-type {{type}}"></span>
-                        <em class="arrow"></em>
                     </li>
                     </li>
                 {{/ list}}
                 {{/ list}}
             </ul>
             </ul>