renzhou
/
suzhou
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交

Browse Source
main
liudan 2 years ago
parent 03c401b115
commit 039fb81c4c
3 changed files with 136 additions and 35 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 120
      css/index.css
  2. 43
      index.html
  3. 8
      js/index.js

120
css/index.css
Unescape View File

@ -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;
}
}

43
index.html
Unescape View File

@ -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">

8
js/index.js
Unescape View File

@ -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)
}

Write Preview
Loading…
Cancel
Save