From 039fb81c4cfa1e0bf7ab823a656e361b7dc417b9 Mon Sep 17 00:00:00 2001
From: liudan <18634735655@163.com>
Date: Fri, 30 Dec 2022 22:58:35 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/index.css | 120 ++++++++++++++++++++++++++++++++++++++++++--------
 index.html    |  43 +++++++++++-------
 js/index.js   |   8 +++-
 3 files changed, 136 insertions(+), 35 deletions(-)

diff --git a/css/index.css b/css/index.css
index 299be61..766844b 100644
--- a/css/index.css
+++ b/css/index.css
@@ -61,19 +61,19 @@
 	height: 100%;
 	z-index: 0;
 }
-.img1{
+.image1{
     bottom: 18%;width: 60%;left: 20%;
 }
-.img2{
+.image2{
     bottom: 29%;width: 54%;left: 28%;
 }
-.img3{
+.image3{
     bottom: 27%;width: 37%;left: 11%;
 }
-.img4{
+.image4{
     bottom: 20%;width: 58%;left: 14%;
 }
-.img5{
+.image5{
     bottom: 38%;width: 50%;left: 25%;
 }
 .index_main .section1 .index_banner .items:after{
@@ -254,6 +254,12 @@ a:active{
 .section3{
     position:relative;
 }
+.mobileIcon{
+    display: none;
+}
+.mobilebtn{
+    display: none;
+}
 .section3.active .second3Title{
     -webkit-animation-duration: 2s; 
     -moz-animation-duration: 2s; 
@@ -923,10 +929,33 @@ a:active{
     
 }
 @media only screen and (min-width: 992px) and (max-width: 1199px) {
-
+   
 }
 @media only screen and (min-width: 576px) and (max-width: 767px) {
-  
+    .mobileIcon{
+        display: block;
+        background-color: #ffffff;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-around;
+        border-radius: 10px;
+        padding: 10px 0 0 0
+    }
+    .mobilebtn{
+        display: block;
+        text-align: center;
+    }
+    .mobilebtn button{
+        padding:4px 20px;
+        border: 1px solid #134BA1;
+        border-radius: 30px;
+    
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #134BA1;
+        margin: 10px;
+    }
 }
 @media (max-width: 575px) {
   .numberContent{
@@ -1057,7 +1086,7 @@ a:active{
     .newsLeftContent,.companyLeftContent{
         display: flex;
         align-items: center;
-        margin-top:10px;
+        margin-top:15px;
         justify-content: space-between;
     }
     .newsLeftContent h2,.companyLeftContent h2{
@@ -1080,6 +1109,17 @@ a:active{
         font-weight: 400;
         color: #134BA1;
     }
+    .newsLeftContent p{
+        margin:0;
+        padding: 0;
+        font-size: 16px;
+        font-family: Arial;
+        font-weight: 400;
+        color: #999999;
+        line-height: 20px;
+        margin-top:0px;
+        margin-bottom: 0px;
+    }
     .middleContent{
         margin-top:10px;
     }
@@ -1089,12 +1129,13 @@ a:active{
     .companyLeftContent p {
         margin: 0;
         padding: 0;
-        font-size: 20px;
+        font-size: 16px;
         font-family: Arial;
         font-weight: 400;
         color: #FFFFFF;
-        margin-top: 20px;
-        margin-bottom: 20px;
+        margin-top: 0px;
+        line-height: 20px;
+        margin-bottom: 0px;
     }
     .footer {
         /* margin-top: 32px; */
@@ -1152,22 +1193,65 @@ a:active{
         position: absolute;
         top:25%;
     }
-    .img1{
-        bottom: 18%;width: 100%;left: 0%;
+    .image1{
+        bottom: 10%;width: 100%;left: 0%;
     }
-    .img2{
+    .image2{
         bottom: 29%;width: 100%;left: 0%;
     }
-    .img3{
+    .image3{
         bottom: 27%;width: 100%;left: 0%;
     }
-    .img4{
-        bottom: 20%;width: 100%;left: 0%;
+    .image4{
+        bottom: 40%;width: 100%;left: 0%;
     }
-    .img5{
+    .image5{
         bottom: 38%;width: 100%;left: 0%;
     }
     .category__item .imgcontainer{
         height:200px;
     }
+    .mobileIcon{
+        display: block;
+        background-color: #ffffff;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-around;
+        border-radius: 10px;
+        padding: 10px 0 0 0
+    }
+    .mobileIcon img{
+        width:45%;
+    }
+    .sliderContainer {
+        overflow: hidden;
+        padding-top: 10px;
+        padding-bottom: 10px;
+    }
+    .mobilebtn{
+        display: block;
+        text-align: center;
+    }
+    .mobilebtn button{
+        padding:4px 20px;
+        border: 1px solid #134BA1;
+        border-radius: 30px;
+    
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #134BA1;
+        margin: 10px;
+    }
+    .items1{
+        background-position: 67% !important;
+    }
+    .item2{
+        background-position: 22% !important;
+        background-size: 255% 100% !important;
+    }
+    .item4{
+        background-position: 40% !important; 
+        background-size: 200% 100% !important;
+    }
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index f623ae0..dca8e37 100644
--- a/index.html
+++ b/index.html
@@ -151,30 +151,30 @@
         <div class="section section1">
             <div class="index_banner">
                 <div class="item">
-                    <div class="items scaleBg" style="background-image: url(images/1t.png);">
-                        <img src="/images/text1.png" alt="" class="img1">
+                    <div class="items scaleBg items1" style="background-image: url(images/1t.png);">
+                        <img src="/images/text1.png" alt="" class="image1">
                     </div>
                 </div>
                 <div class="item">
-                    <div class="items scaleBg" style="background-image: url(images/2t.png);">
-                        <img src="/images/text2.png" alt="" class="img2">
+                    <div class="items scaleBg item2" style="background-image: url(images/2t.png);">
+                        <img src="/images/text2.png" alt="" class="image2">
                     </div>
                 </div>
                 <div class="item">
                     <div class="items scaleBg" style="background-image: url(images/3t.png);">
-                        <img src="/images/text3.png" alt="" class="img3">
+                        <img src="/images/text3.png" alt="" class="image3">
                     </div>
                    
                 </div>
                 <div class="item">
-                    <div class="items scaleBg" style="background-image: url(images/4t.png);">
-                        <img src="/images/text4.png" alt="" class="img4">
+                    <div class="items scaleBg item4" style="background-image: url(images/4t.png);">
+                        <img src="/images/text4.png" alt="" class="image4">
                     </div>
                   
                 </div>
                 <div class="item">
                     <div class="items scaleBg" style="background-image: url(images/5t.png);">
-                        <img src="/images/text5.png" alt="" class="img5">
+                        <img src="/images/text5.png" alt="" class="image5">
                     </div>
                      
                 </div>
@@ -280,7 +280,7 @@
                     <div class="col-xs-12 col-sm-12 col-md-6 col-lg-3 col-xl-3 col-xxl-3 news_left_container">
                         <div class="newsLeftContent">
                             <h2>最新动态</h2>
-                            <p class="d-none d-md-block">NEWS<br>INFORMATION</p>
+                            <p>NEWS<br>INFORMATION</p>
                             <a href="http://sct.njrenzhou.cn/news/news01.html"><button>探索更多</button></a>
                         </div>
                     </div>
@@ -301,19 +301,19 @@
         <div class="section section5">
 
             <!-- 上市企业 -->
-            <div class="conpanyBrand" style="width: 100%!important;">
+            <div class="conpanyBrand" style="width: 100%!important;margin-top:5%">
                 <div class="container">
                     <div class="row news_Container"> 
                         <div class="col-xs-12 col-sm-12 col-md-6 col-lg-3 col-xl-3 col-xxl-3 sliderContainer1">
                             <div class="companyLeftContent">
                                 <h2>上市企业</h2>
-                                <p class="d-none d-md-block">LISTED<br>ENTERPRISES</p>
+                                <p>LISTED<br>ENTERPRISES</p>
                                 <a href="http://sct.njrenzhou.cn/service/service14.html"><button>探索更多</button></a>
                                 
                             </div>
                         </div>
                         <div class="col-xs-12 col-sm-12 col-md-6 col-lg-9 col-xl-9 col-xxl-9 sliderContainer" style="background-color: rgba(0,0,0,0.4);border-radius:10px;">
-                            <div  style="background:#ffffff;overflow: hidden;padding-top: 18px;">
+                            <div  style="background:#ffffff;overflow: hidden;padding-top: 18px;" class="d-none d-md-block">
                                 <div class="g1 scrollItem">
                                     <ul>
                                     
@@ -330,7 +330,15 @@
                                     </ul>
                                 </div>
                             </div>
+                            <div class="mobileIcon">
+
+                            </div>
                         </div>
+                        <div class="mobilebtn">
+                            <a style="margin:auto" href="/service/service14.html"><button>探索更多</button></a>
+
+                        </div>
+                        
                     </div>
                 </div>
             </div>
@@ -394,6 +402,9 @@
                 </div>
 
             </div>
+            
+        </div>
+        <div class="section section6 fp-auto-height fp-section">
             <div class="footer-bottom">
                 <div class="container">
                     <div class="registerContainer">
@@ -413,12 +424,12 @@
                                 
                             </div>
                             <!-- <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 col-xl-8 col-xxl-8">
-                               <div class="leftContent">
+                            <div class="leftContent">
                                     <img src="./images/ewm.jpg" alt="">
-                               </div>
-                               <div class="contactUs">
+                            </div>
+                            <div class="contactUs">
                                 ©2015-2022 苏州创新投资集团有限公司  苏ICP备10219514号-1      苏公网安备 4401060342d234275号营业执照
-                               </div>
+                            </div>
                             </div>
                             <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4 col-xxl-4 selectContainer">
                                 <select  placeholder="相关链接" class="select">
diff --git a/js/index.js b/js/index.js
index 025e717..1350c68 100644
--- a/js/index.js
+++ b/js/index.js
@@ -309,10 +309,12 @@ $(function(){
         let data = res.data.data
         let firstList = data.slice(0,num);
         let secondList = data.slice(num,num*2);
-        let thirdList = data.slice(num*2,num*3)
+        let thirdList = data.slice(num*2,num*3);
+        let forthList = data.slice(0,8)
         let html=''
         let html1=''
         let html2=''
+        let html3=''
         firstList.forEach((item,index)=>{
           html+=`<li><img src="https://suzhou.njrenzhou.cn${item.thumb}"></li>`
         })
@@ -322,9 +324,13 @@ $(function(){
         thirdList.forEach((item,index)=>{
           html2+=`<li><img src="https://suzhou.njrenzhou.cn${item.thumb}"></li>`
         })
+        forthList.forEach((item,index)=>{
+          html3+=`<img src="https://suzhou.njrenzhou.cn${item.thumb}">`
+        })
         $('.g1 ul').append(html)
         $('.g2 ul').append(html1)
         $('.g3 ul').append(html2)
+        $('.mobileIcon').append(html3)
         groupSlide()
         // console.log(firstList,secondList,thirdList)
       }