明星小头像修改

@@ -22,7 +22,27 @@
             {{#each articles}}
                 <li data-id="{{id}}">
                     <div class="star-avatar">
-                        {{#if isSwiper}}
+                        <div class="avatar-wrap">
+                            {{# tags}}
+                                <a href="{{avatarUrl}}">
+                                    <div data-avatar="{{image cover 100 100}}" class="rank-avatar" ></div>
+                                    <p class="name">{{tagName}}1</p>
+                                </a>
+                            {{/ tags}}
+                            {{# tags}}
+                                <a href="{{avatarUrl}}">
+                                    <div data-avatar="{{image cover 100 100}}" class="rank-avatar" ></div>
+                                    <p class="name">{{tagName}}2</p>
+                                </a>
+                            {{/ tags}}
+                            {{# tags}}
+                                <a href="{{avatarUrl}}">
+                                    <div data-avatar="{{image cover 100 100}}" class="rank-avatar" ></div>
+                                    <p class="name">{{tagName}}3</p>
+                                </a>
+                            {{/ tags}}
+                        </div>
+                        {{!-- {{#if isSwiper}}
                             <div class="article-avatar-swiper">
                                 <ul class="clearfix swiper-wrapper">
                                     {{#each tags}}
@@ -42,7 +62,7 @@
                                     <p class="name">{{tagName}}</p>
                                 </a>
                             {{/ tags}}
-                        {{/if}}
+                        {{/if}} --}}
                     </div>
                     <a class="star-article" href='{{url}}'>
                         <i class="article-arrow"></i>

@@ -203,6 +203,7 @@ getIndexHtml = function() {
             loading.hideLoadingMask();
         },
         error: function() {
+            loading.hideLoadingMask();
             tip.show('网络断开连接了~');
         }
     });

+@keyframes avatar {
+    25% {
+        transform: translate3d(0, 0, 0);
+    }
+
+    50% {
+        transform: translate3d(-120px, 0, 0);
+    }
+
+    75% {
+        transform: translate3d(-240px, 0, 0);
+    }
+}
+
 .star-page {
     background: #333;
     position: relative;
@@ -182,16 +196,26 @@
         li {
             float: left;
             margin-bottom: 30px;
+            padding-left: 10px;
         }
     }
 
     .star-avatar {
         width: 134px;
-        padding-left: 30px;
         box-sizing: border-box;
         float: left;
         overflow: hidden;
 
+        .avatar-wrap {
+            white-space: nowrap;
+            animation: avatar 6s infinite;
+        }
+
+        a {
+            display: inline-block;
+            padding: 8px;
+        }
+
         .article-avatar-swiper {
             width: 104px;
             overflow: hidden;
@@ -201,7 +225,7 @@
             width: 104px;
             height: 104px;
             border-radius: 50%;
-            float: left;
+            margin: 0 auto;
         }
 
         .name {
@@ -225,7 +249,6 @@
         float: left;
         padding: 20px 30px;
         box-sizing: border-box;
-        margin-left: 18px;
 
         .article-arrow {
             position: absolute;