banner 背景图 @review by 徐祁

 {{> layout/header}}
-<div class="home-page yoho-page kids" data-page="kids">
+<div class="home-page yoho-page kids" data-page="kids"> 
 {{# kids}}
     {{! 头部banner}}
     {{# slide}}

-<div class="slide-container">
+<div class="slide-container {{#if pagination}}slide-thumb-container{{/if}}">
     <div class="slide-wrapper"> 
         <ul>
             {{# list}}
-            <li>
+            <li style="backgroundColor:{{bgColor}}">
                 <a href="{{href}}" target= "_blank">
                     <img class="lazy" data-original="{{img}}" alt="">
                 </a>
@@ -37,4 +37,5 @@
         </ul>
     </div>
     {{/if}}
-</div>
\ No newline at end of file
+</div>
+<div class="slide-container-placeholder {{#if pagination}}slide-thumb-container-placeholder{{/if}}"></div>
\ No newline at end of file

@@ -6,11 +6,28 @@
     // overflow: hidden;
     /*大banner*/
 	.slide-container {
-        position: relative;
+        position: absolute;
+        left: 0;
+        right: 0;
+        height: 387px;
+
+        &.slide-thumb-container {
+            height: 440px;
+        }
+
 		img {
 			display: block;
 		}
 	}
+
+    .slide-container-placeholder {
+        height: 387px;
+        width: 100%;
+
+        &.slide-thumb-container-placeholder {
+            height: 440px;
+        }
+    }
     
     /*大banner大图*/
 	.slide-wrapper { 
@@ -37,6 +54,13 @@
 			width: 100%;
 			height: 100%;
 
+            a {
+                display: block;
+                height: 100%;
+                width: 990px;
+                margin: 0 auto;
+            }
+
 			&:first-child {
 				display: block;
 			}
@@ -50,7 +74,7 @@
     
     /*大图上的左右切换按钮*/
     .slide-switch {
-        display: none;
+        display: block;
         /* @include opacity(0);
         @include transition-property(opacity);
         @include transition-duration(.2s);
@@ -68,11 +92,13 @@
             @include opacity(0.55);
 
             &.prev {
-                left: 0;
+                left: 50%;
+                margin-left: -495px;
             }
 
             &.next {
-                right: 0;
+                right: 50%;
+                margin-right: -495px;
             }
 
             &:hover{
@@ -88,7 +114,8 @@
     
     /*大banner缩略图*/
     .thumb-pagination {
-        margin: 7px 0 0;
+        width: 990px;
+        margin: 7px auto 0;
 
         li {
             position: relative;
@@ -223,6 +250,17 @@
                 height: 100%;
             }
 
+            .slide-switch {
+                a.prev {
+                    left: 0;
+                    margin-left: 0;
+                }
+                a.next {
+                    right: 0;
+                    margin-right: 0;
+                }
+            }
+
             img {
                 max-width: 100%;
                 max-height: 100%;

@@ -2,13 +2,51 @@
 @media screen and (min-width: 1150px) {
 .home-page {
     width: 1150px;
+    
+    .slide-container{
+        height: 450px;
+
+        &.slide-thumb-container {
+            height: 510px;
+        }
+    }
+    
 
     .slide-wrapper {
         height: 450px;
+
+        li {
+            a {
+                width: 1150px;
+            }
+        }
     }
 
+    .slide-container-placeholder {
+        height: 450px;
+
+        &.slide-thumb-container-placeholder {
+            height: 510px;
+        }
+    }
+
+
+    
+    .slide-switch {
+        a {
+            &.prev {
+                margin-left: -575px;
+            }
+
+            &.next {
+                margin-right: -575px;
+            }
+        }
+    }
+    
     .thumb-pagination {
-        margin: 6px 0 0;
+        width: 1148px;
+        margin: 6px auto 0;
         padding: 0 0 0 2px;
 
         li {