root/feiyang-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

飞阳官网

Browse Source
This commit is contained in:
dzj 2024-04-12 18:14:25 +08:00
parent a92f78af56
commit 00fe1a63e0
1 changed files with 35 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/views/HomeView.vue
View File

@ -3,7 +3,7 @@
<div class="banner" style="height: 581px;">
<div class="bd" style="height: 581px;position: relative;">
<div class="swiper-container">
<div class="swiper-container swiper5">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="@/assets/images/1.png" style="width: 100%;height:100%;"></div>
<div class="swiper-slide"><img src="@/assets/images/2.png" style="width: 100%;height:100%;"></div>
@ -123,11 +123,11 @@
z-index: 2;">
<div class="swiper2" style="max-width: 80vw;overflow: hidden;height: 100%;">
<div class="swiper-wrapper">
<div class="swiper-slide1"><img src="@/assets/images/index3_1.png"></div>
<div class="swiper-slide1"><img src="@/assets/images/index3_2.png"></div>
<div class="swiper-slide1"><img src="@/assets/images/index3_3.png"></div>
<div class="swiper-slide1"><img src="@/assets/images/index3_2.png"></div>
<div class="swiper-slide1"><img src="@/assets/images/index3_3.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_1.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_2.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_3.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_2.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_3.png"></div>
</div>
<div class="swiper-pagination1" style="text-align: center;"></div>
@ -146,7 +146,7 @@
overflow: hidden;
width: 80%;
margin: 0 auto;">
<div class="content2-left">
<div class="content2-left" style="width:100%">
<div>
<h3 style=" line-height: 60px;
font-weight: lighter; font-size: 48px">公司荣耀<br>及成就展示</h3>
@ -155,15 +155,30 @@
<!-- <h3></h3> -->
<h5 style="line-height: 20px;">荣获行业诸多奖项<br>
拥有一支高素质的专业管理团队
拥有一支高素质的专业管理团队<span style="color:RGB(48, 113, 183);float: right;font-weight: bold;">MORE...</span>
</h5>
<!-- <h5></h5> -->
</div>
</div>
</div>
<div>
</div>
</div>
</div>
<!-- <div class="swiper3 swiper-container" style="width:100%">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="@/assets/images/index3_1.png" style="width: 100%;"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_2.png" style="width:100%"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_3.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_2.png"></div>
<div class="swiper-slide"><img src="@/assets/images/index3_3.png"></div>
</div>
<div class="swiper-pagination1" style="text-align: center;"></div>
</div> -->
</div>
</template>
@ -203,7 +218,7 @@ export default {
// 初始化Swiper
new Swiper('.swiper-container', {
new Swiper('.swiper5', {
loop: true,
autoplay: {
delay: 4100,
@ -228,6 +243,12 @@ export default {
el: '.swiper-pagination1'
}
})
new Swiper('.swiper3', {
pagination: {
el: '.swiper-pagination1'
}
})
},
beforeDestroy() {
// 在组件销毁之前停止观察器
@ -277,7 +298,7 @@ export default {
height: 100%;
}
.swiper-slide1 {
.swiper-slide1 {
min-width: calc(26.66666vw - 14px);
max-width: calc(26.66666vw - 14px);
@ -290,8 +311,11 @@ export default {
border-radius: 10px;
}
.swiper-slide2{
width:100%;
.swiper-slide::after {
}
.swiper5 .swiper-slide::after {
content: '';
left: 0px;
position: absolute;