首页轮播优化

app/index/view/default/index/index.html

@@ -19,13 +19,9 @@
 <!-- banner -->
 {{include file="public/home_banner" /}}
 
-<!-- 轮播上内容 -->
-<div class="am-container slideall">
-    <!-- 轮播-手机导航 -->
-    {{include file="public/home_nav" /}}
-
-    <!-- 轮播-聚合内容 -->
-    {{if MyC('home_index_banner_right_status', 1) eq 1}}
+<!-- 轮播-聚合内容 -->
+{{if MyC('home_index_banner_right_status', 1) eq 1}}
+    <div class="am-container slideall">
         <div class="banner-mixed">
             <div class="mod-vip">
                 <div class="m-baseinfo">
@@ -104,8 +100,11 @@
                 {{/foreach}}
             {{/if}}
         </div>
-    {{/if}}
-</div>
+    </div>
+{{/if}}
+
+<!-- 轮播-手机导航 -->
+{{include file="public/home_nav" /}}
 
 <!-- 楼层数据顶部钩子 -->
 {{if isset($shopxo_is_develop) and $shopxo_is_develop eq true}}

app/index/view/default/public/home_banner.html

-<div class="banner">
-    <div data-am-widget="slider" class="am-slider am-slider-a1" data-am-slider='{&quot;directionNav&quot;:false}'>
-        <ul class="am-slides">
-            {{if !empty($banner_list)}}
+{{if !empty($banner_list)}}
+    <div class="banner">
+        <div data-am-widget="slider" class="am-slider am-slider-a1" data-am-slider='{&quot;directionNav&quot;:false}'>
+            <ul class="am-slides">
                 {{foreach $banner_list as $banner}}
                     {{if !empty($banner['images_url'])}}
                         <li {{if !empty($banner['bg_color'])}}style="background: {{$banner.bg_color}};"{{/if}} title="{{$banner.name}}">
@@ -21,7 +21,7 @@
                         </li>
                     {{/if}}
                 {{/foreach}}
-            {{/if}}
-        </ul>
+            </ul>
+        </div>
     </div>
-</div>
\ No newline at end of file
+{{/if}}
\ No newline at end of file

app/index/view/default/public/home_nav.html

 {{if !empty($navigation)}}
-    <div class="am-g am-g-fixed small-nav">
-        {{foreach $navigation as $nav}}
-            <div class="am-u-sm-3">
-                {{switch nav.event_type}}
-                    {{case 3}}
-                        <!-- 地图 -->
-                        <a href="javascript:;" {{if $nav['is_need_login'] eq 1 and empty($user)}} class="login-event" {{else /}}{{if !empty($nav['event_value_data']) and isset($nav['event_value_data'][2]) and isset($nav['event_value_data'][3]) and $nav['event_value_data'][2] neq 0 and $nav['event_value_data'][3] neq 0}}class="submit-map-popup" data-lng="{{$nav['event_value_data'][2]}}" data-lat="{{$nav['event_value_data'][3]}}"{{/if}}{{/if}}>
-                    {{/case}}
-                    {{case 4}}
-                        <!-- 电话 -->
-                        <a {{if $nav['is_need_login'] eq 1 and empty($user)}} href="javascript:;" class="login-event" {{else /}}{{if !empty($nav['event_value'])}}href="tel:{{$nav.event_value}}"{{else /}}href="javascript:;"{{/if}}{{/if}}>
-                    {{/case}}
-                    {{default /}}
-                        <!-- 默认url地址 -->
-                        <a {{if $nav['is_need_login'] eq 1 and empty($user)}} href="javascript:;" class="login-event" {{else /}}{{if !empty($nav['event_value'])}}href="{{$nav.event_value}}" target="_blank"{{else /}}href="javascript:;"{{/if}}{{/if}}>
-                {{/switch}}
-                    <div class="nav-icon" style="{{if !empty($nav['bg_color'])}}background:{{$nav.bg_color}};{{/if}}">
-                        <img src="{{$nav.images_url}}" alt="{{$nav.name}}" />
-                    </div>
-                    <div class="mini-nav-title">{{$nav.name}}</div>
-                </a>
-            </div>
-        {{/foreach}}
+    <div class="am-container">
+        <div class="am-g am-g-fixed small-nav">
+            {{foreach $navigation as $nav}}
+                <div class="am-u-sm-3">
+                    {{switch nav.event_type}}
+                        {{case 3}}
+                            <!-- 地图 -->
+                            <a href="javascript:;" {{if $nav['is_need_login'] eq 1 and empty($user)}} class="login-event" {{else /}}{{if !empty($nav['event_value_data']) and isset($nav['event_value_data'][2]) and isset($nav['event_value_data'][3]) and $nav['event_value_data'][2] neq 0 and $nav['event_value_data'][3] neq 0}}class="submit-map-popup" data-lng="{{$nav['event_value_data'][2]}}" data-lat="{{$nav['event_value_data'][3]}}"{{/if}}{{/if}}>
+                        {{/case}}
+                        {{case 4}}
+                            <!-- 电话 -->
+                            <a {{if $nav['is_need_login'] eq 1 and empty($user)}} href="javascript:;" class="login-event" {{else /}}{{if !empty($nav['event_value'])}}href="tel:{{$nav.event_value}}"{{else /}}href="javascript:;"{{/if}}{{/if}}>
+                        {{/case}}
+                        {{default /}}
+                            <!-- 默认url地址 -->
+                            <a {{if $nav['is_need_login'] eq 1 and empty($user)}} href="javascript:;" class="login-event" {{else /}}{{if !empty($nav['event_value'])}}href="{{$nav.event_value}}" target="_blank"{{else /}}href="javascript:;"{{/if}}{{/if}}>
+                    {{/switch}}
+                        <div class="nav-icon" style="{{if !empty($nav['bg_color'])}}background:{{$nav.bg_color}};{{/if}}">
+                            <img src="{{$nav.images_url}}" alt="{{$nav.name}}" />
+                        </div>
+                        <div class="mini-nav-title">{{$nav.name}}</div>
+                    </a>
+                </div>
+            {{/foreach}}
+        </div>
     </div>
 {{/if}}
\ No newline at end of file

public/static/index/default/css/index.css

@@ -51,22 +51,19 @@ text-align: center;float:none}
 .small-nav img { width: 100%; }
 .floor .goods-list .goods-items .goods-images{ padding: 10px; }
 .slideall {position: relative;}
+.banner{ width:100%;overflow:hidden;}
+.banner .am-slider .am-slides li > a {display: block; max-width: 1920px; margin: 0 auto;height: 100%;}
+.banner .am-slider .am-slides li img {max-width: 100%; height: 100%;object-fit: cover;}
 @media only screen and (min-width: 480px) {
     .small-nav img{max-width: 100%;max-height: 100%;}
     .small-nav{ font-size:14px;}
 }
-
 @media only screen and (min-width: 640px) {
     /*标题*/
     .items-nav-title{background: #fff; border-bottom: 2px solid #666;}
     .am-container {padding-left:0px;padding-right:0px ;}
     .home-floor{width:100%;background:#fff;overflow:visible;}
 
-    /*主题布局*/
-    .banner{ width:100%;overflow:hidden;}
-    .banner .am-slider .am-slides li > a {display: block; max-width: 1920px; margin: 0 auto;height: 100%;}
-    .banner .am-slider .am-slides li img {max-width: 100%; height: 100%;object-fit: cover;}
-
      /*改写的公告*/
     .banner-mixed{height:auto; background:#FFF; opacity:0.8; -webkit-transition: opacity .2; -moz-transition: opacity .2s ease-in; -ms-transition: opacity .2s ease-in; -o-transition: opacity .2s ease-in; transition: opacity .2s ease-in;text-align: center; margin-bottom: 10px; }
     .banner-news-title{font-size: 14px;position: static;border-right:none ;color:#e60012 ;font-size: 16px;font-weight: 600; text-align: center;}
@@ -165,11 +162,17 @@ text-align: center;float:none}
     /*楼层*/
     .floor .aggregation { width: 222px; }
 }
-
+@media only screen and (max-width: 1025px) {
+    .banner .am-slider .am-slides li img {height: 360px;}
+}
+@media only screen and (max-width: 800px) {
+    .banner .am-slider .am-slides li img {height: 280px;}
+}
 @media only screen and (max-width: 640px) {
     .items-nav-title{ padding: 0 10%;}
     .banner-news-title{line-height: 30px; height: 30px; color: #333; max-width: 62px;}
     .am-footer { padding-bottom: 50px; }
+    .banner .am-slider .am-slides li img {height: 200px;}
 
     /*楼层*/
     .floor .aggregation { width: 100%; height: auto; }