Skip to content

P
project-online-pc
提交 d3596b92 authored 作者: matian's avatar matian
浏览文件
操作

style:样式调整

上级 5e74fa37
隐藏空白字符变更
内嵌 并排
正在显示 包含 289 行增加 和 180 行删除
components/home/Video.vue
浏览文件 @ d3596b92
<template> <template>
<div class="banner-content"> <div class="banner-content">
<img class="img" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/video.png" alt="" /> <img class="img" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/video.png" alt="" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/video_logo.png" alt="" @click="open" /> <img
class="img1"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/video_logo.png"
alt=""
@click="open"
/>
<video <video
v-show="isShow" v-show="isShow"
class="video" class="video"
...@@ -47,16 +52,19 @@ export default { ...@@ -47,16 +52,19 @@ export default {
} }
.banner-content { .banner-content {
position: relative; position: relative;
width: 1200px; width: 100%;
margin: 0 auto; margin: 0 auto;
margin-top: 56px; margin-top: 56px;
margin-bottom: 100px; .img1 {
img {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
.img {
width: 100%;
height: 100%;
}
.video { .video {
width: 60%; width: 60%;
height: 100%; height: 100%;
......
components/home/news.vue
浏览文件 @ d3596b92
...@@ -76,6 +76,8 @@ export default { ...@@ -76,6 +76,8 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.is-pc { .is-pc {
.news-content-box { .news-content-box {
position: relative;
transform: scale(0.78);
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
padding-top: 65px; padding-top: 65px;
......
components/home/projectFeatures.vue
浏览文件 @ d3596b92
<template> <template>
<div class="service-content max-width-center"> <div class="service-content max-width-center">
<div :class="isMobile ? 'is-h5' : 'is-pc'"> <div class="is-pc">
<card :title="$t('home.project.title')"> <card :title="$t('home.project.title')">
<ul class="nav-content"> <ul class="nav-content">
<li v-for="(item, index) in data" :key="index"> <li v-for="(item, index) in data" :key="index">
...@@ -11,11 +11,6 @@ ...@@ -11,11 +11,6 @@
</ul> </ul>
</card> </card>
</div> </div>
<!-- <img
style="padding:56px 0 30px;position: relative;width: 1200px;margin: 0 auto;"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school.png"
alt=""
/> -->
</div> </div>
</template> </template>
<script> <script>
...@@ -48,26 +43,6 @@ export default { ...@@ -48,26 +43,6 @@ export default {
iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/img31.png', iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/img31.png',
text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT1') : this.$t('home.project.pc.itemT7') text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT1') : this.$t('home.project.pc.itemT7')
} }
// {
// icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon2.png',
// iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon2_a.png',
// text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT2') : this.$t('home.project.pc.itemT2')
// },
// {
// icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon3.png',
// iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon3_a.png',
// text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT3') : this.$t('home.project.pc.itemT3')
// },
// {
// icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon4.png',
// iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon4_a.png',
// text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT4') : this.$t('home.project.pc.itemT4')
// },
// {
// icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon5.png',
// iconActive: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/mary_features_icon5_a.png',
// text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT5') : this.$t('home.project.pc.itemT5')
// }
] ]
} }
}, },
...@@ -92,12 +67,23 @@ export default { ...@@ -92,12 +67,23 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .card-hd__title {
position: relative;
transform: scale(0.78);
left: -80px;
}
.is-pc { .is-pc {
display: flex;
justify-content: center;
margin-left: -80px;
margin-top: 81px;
.service-content { .service-content {
padding-top: 68px; padding-top: 68px;
width: 1200px;
.nav-content { .nav-content {
display: flex; display: flex;
justify-content: flex-start; justify-content: center;
padding-top: 15px; padding-top: 15px;
li { li {
width: 224px; width: 224px;
...@@ -148,33 +134,4 @@ export default { ...@@ -148,33 +134,4 @@ export default {
margin: 0 auto; margin: 0 auto;
} }
} }
.is-h5 {
.service-content {
ul {
display: flex;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
}
li {
min-width: 0.78rem;
background: #ffffff;
margin-right: 0.1rem;
padding-top: 0.11rem;
img {
width: 0.4rem;
height: 0.4rem;
display: block;
margin: 0 auto;
}
.text {
font-size: 0.1rem;
line-height: 0.16rem;
color: #666666;
padding-top: 0.05rem;
text-align: center;
padding-bottom: 0.1rem;
}
}
}
}
</style> </style>
components/home/schoolSenery.vue
浏览文件 @ d3596b92
...@@ -34,6 +34,7 @@ export default {} ...@@ -34,6 +34,7 @@ export default {}
.main-content { .main-content {
margin-top: 65px; margin-top: 65px;
position: relative; position: relative;
width: 100%;
.img1 { .img1 {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -72,7 +73,9 @@ export default {} ...@@ -72,7 +73,9 @@ export default {}
align-items: center; align-items: center;
position: absolute; position: absolute;
bottom: 226px; bottom: 226px;
left: 426px; top: 256px;
left: 50%;
transform: translateX(-50%);
img { img {
margin-right: 39px; margin-right: 39px;
} }
......
components/recommend.vue
浏览文件 @ d3596b92
<template> <template>
<div> <div v-if="listData.length">
<div class="recommend-content"> <div class="recommend-content">
<div class="titles"> <div class="titles">
<div class="line"></div> <div class="line"></div>
......
langs/zh-CN.js
浏览文件 @ d3596b92
...@@ -268,14 +268,14 @@ export default { ...@@ -268,14 +268,14 @@ export default {
viewMore: '查看更多+', viewMore: '查看更多+',
// 右侧弹窗 // 右侧弹窗
aside: { aside: {
apply: '报名申请', apply: '报名咨询',
apply2: '我要咨询', apply2: '我要咨询',
follow: '关注我们', follow: '关注我们',
name: '请输入您的名字', name: '请输入您的名字',
phone: '请输入您的电话', phone: '请输入您的电话',
code: '请输入验证码', code: '请输入验证码',
codeBtn: '获取验证码', codeBtn: '获取验证码',
formBtn: '立即报名', formBtn: '立即预约',
project1: '综合管理方向工商管理硕士', project1: '综合管理方向工商管理硕士',
project2: '金融方向工商管理硕士', project2: '金融方向工商管理硕士',
project3: '酒店和旅游方向工商管理硕士', project3: '酒店和旅游方向工商管理硕士',
......
nuxt.config.js
浏览文件 @ d3596b92
...@@ -17,7 +17,7 @@ export default { ...@@ -17,7 +17,7 @@ export default {
}), }),
// Global page headers: https://go.nuxtjs.dev/config-head // Global page headers: https://go.nuxtjs.dev/config-head
head: { head: {
title: '紫荆教育-玛丽伍德大学数字领导力方向MBA', title: '紫荆教育-1+1国际硕士',
htmlAttrs: { htmlAttrs: {
lang: 'en' lang: 'en'
}, },
......
pages/index.vue
浏览文件 @ d3596b92
...@@ -7,6 +7,9 @@ ...@@ -7,6 +7,9 @@
<el-button class="btn1" @click="showApplyForm">报名咨询</el-button> <el-button class="btn1" @click="showApplyForm">报名咨询</el-button>
</div> </div>
</div> </div>
<p class="desc">
紫荆教育与纽约州立大学石溪分校、斯蒂文斯理工学院、玛丽伍德大学等美国知名院校联合推出国际硕士1+1项目，针对当下数字经济时代最需要的商业分析大数据、金融和数字领导力等方向打造国际领先的人才培养体系，志在培养立足中国本土实践、兼具国际视野的复合型新时代人才。
</p>
<!-- 我要咨询弹框 --> <!-- 我要咨询弹框 -->
<consultingForm :visible.sync="popupVisible" @success="hideApplyForm" @close="close" /> <consultingForm :visible.sync="popupVisible" @success="hideApplyForm" @close="close" />
<!-- 项目特色 --> <!-- 项目特色 -->
...@@ -86,9 +89,13 @@ export default { ...@@ -86,9 +89,13 @@ export default {
z-index: 1000; z-index: 1000;
} }
.btn { .btn {
display: flex;
justify-content: center;
position: absolute; position: absolute;
top: 461px; top: 461px;
left: 850px; left: 50%;
transform: translateX(-50%);
} }
.btn1 { .btn1 {
width: 104px; width: 104px;
...@@ -105,5 +112,18 @@ export default { ...@@ -105,5 +112,18 @@ export default {
opacity: 1; opacity: 1;
} }
} }
.desc {
width: 1200px;
font-size: 16px;
font-weight: 400;
line-height: 32px;
color: #666666;
position: absolute;
left: 50%;
transform: translateX(-50%);
margin-top: 79px;
padding-left: 150px;
padding-right: 100px;
}
} }
</style> </style>
pages/school/school1.vue
浏览文件 @ d3596b92
<template> <template>
<div> <div>
<img <div class="banner">
style="width:100%;height:100%" <img style="width:100%;height:100%" src="https://webapp-pub.ezijing.com/project/marywood/school11.png" />
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school11.png" <div class="btn">
alt="" <el-button class="btn1" @click="showApplyForm">报名咨询</el-button>
/> </div>
<div class="content"> <div class="content">
<img <img class="img1" src="https://webapp-pub.ezijing.com/project/marywood/school12.png" />
style="width:1200px;height:661px;margin-top:10px;margin:auto;text-align:center" </div>
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school12.png"
alt=""
/>
</div> </div>
<img <img
style="padding-right:364px;margin-top:68px" style="width:1200px;height:100%;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school13.png" class="img2"
alt="" src="https://webapp-pub.ezijing.com/project/marywood/school13.png"
/> />
<img <img
style="margin-top:68px" style="width:100%;height:100%;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school14.png" src="https://webapp-pub.ezijing.com/project/marywood/school14.png"
alt=""
/>
<img
style="margin-top:68px;padding-left:368px;padding-right:368px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school15.png"
alt=""
/>
<img
style="margin-top:64px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school16.png"
alt=""
/> />
<div class="content">
<img src="https://webapp-pub.ezijing.com/project/marywood/school15.png" />
</div>
<img <img
style="margin-top:68px;padding-left:368px;padding-right:368px" style="width:100%;height:100%;margin-top:64px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school17.png" src="https://webapp-pub.ezijing.com/project/marywood/school16.png"
alt=""
/> />
<div style="display:flex;justify-content:flex-start;margin-left:360px;margin-top:64px;"> <div class="content">
<img src="https://webapp-pub.ezijing.com/project/marywood/school17.png" />
</div>
<div
style="margin:auto;text-align:center;width:1200px;display:flex;justify-content:flex-start;margin-top:64px;margin-left:30px"
>
<div style="width: 6px;height: 34px;background: #AA1941;margin-right:9px;margin-top:6px"></div> <div style="width: 6px;height: 34px;background: #AA1941;margin-right:9px;margin-top:6px"></div>
<h1 style="color: #333333; font-size: 34px;font-weight: bold;">校园风光</h1> <h1 style="color: #333333; font-size: 34px;font-weight: bold;">校园风光</h1>
</div> </div>
...@@ -51,22 +43,26 @@ ...@@ -51,22 +43,26 @@
</div> </div>
</div> </div>
</div> </div>
<consultingForm :visible.sync="popupVisible" @success="hideApplyForm" @close="close" />
</div> </div>
</template> </template>
<script> <script>
import consultingForm from '../../components/consultingForm.vue'
export default { export default {
layout: 'normal', layout: 'normal',
components: { consultingForm },
data() { data() {
const _this = this const _this = this
return { return {
popupVisible: false,
listData: [ listData: [
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_lg1.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_lg1.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_lg2.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_lg2.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_lg3.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_lg3.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_lg4.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_lg4.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_lg5.png' } { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_lg5.png' }
], ],
swiperOption: { swiperOption: {
observer: true, observer: true,
...@@ -100,16 +96,58 @@ export default { ...@@ -100,16 +96,58 @@ export default {
}, },
swiperStart() { swiperStart() {
this.swiper.autoplay.start() this.swiper.autoplay.start()
},
showApplyForm() {
this.popupVisible = true
document.getElementsByTagName('body')[0].style.height = '100%'
document.getElementsByTagName('body')[0].style.overflow = 'hidden'
},
close() {
this.popupVisible = false
document.getElementsByTagName('body')[0].style.height = ''
document.getElementsByTagName('body')[0].style.overflow = ''
},
hideApplyForm() {
this.popupVisible = false
document.getElementsByTagName('body')[0].style.height = ''
document.getElementsByTagName('body')[0].style.overflow = ''
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.btn {
display: flex;
justify-content: center;
position: absolute;
bottom: 159px;
left: 50%;
transform: translateX(-50%);
}
.btn1 {
width: 104px;
height: 32px;
border: 1px solid #ffffff;
font-size: 14px;
font-weight: 400;
line-height: 8px;
background: none;
color: #fff;
}
.btn1:hover {
background-color: #aa1941;
opacity: 1;
}
.content { .content {
width: 1200px; width: 1200px;
margin: auto; margin: auto;
text-align: center; text-align: center;
margin-top: 70px; margin-top: 70px;
img {
width: 100%;
height: 100%;
}
} }
.swiper-content { .swiper-content {
padding-top: 37px; padding-top: 37px;
...@@ -124,6 +162,7 @@ export default { ...@@ -124,6 +162,7 @@ export default {
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
line-height: 100%;
} }
} }
.swiper-slide-active { .swiper-slide-active {
......
pages/school/school2.vue
浏览文件 @ d3596b92
<template> <template>
<div> <div>
<img <div class="banner">
style="width:100%;height:100%" <img style="width:100%;height:100%" src="https://webapp-pub.ezijing.com/project/marywood/school21.png" />
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school21.png" <div class="btn">
alt="" <el-button class="btn1" @click="showApplyForm">报名咨询</el-button>
/> </div>
<div class="content"> <div class="content">
<img <img class="img1" src="https://webapp-pub.ezijing.com/project/marywood/school12.png" />
style="width:1200px;height:661px;margin-top:10px;margin:auto;text-align:center" </div>
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school22.png"
alt=""
/>
</div> </div>
<img
style="padding-right:364px;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school23.png"
alt=""
/>
<img
style="margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school24.png"
alt=""
/>
<img <img
style="margin-top:68px;padding-left:368px;padding-right:368px" style="width:1200px;height:100%;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school25.png" class="img2"
alt="" src="https://webapp-pub.ezijing.com/project/marywood/school23.png"
/> />
<img <img
style="margin-top:64px" style="width:100%;height:100%;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school26.png" src="https://webapp-pub.ezijing.com/project/marywood/school24.png"
alt=""
/> />
<div class="content">
<img src="https://webapp-pub.ezijing.com/project/marywood/school25.png" />
</div>
<img <img
style="margin-top:68px;padding-left:368px;padding-right:368px" style="width:100%;height:100%;margin-top:64px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school27.png" src="https://webapp-pub.ezijing.com/project/marywood/school26.png"
alt=""
/> />
<div style="display:flex;justify-content:flex-start;margin-left:360px;margin-top:64px"> <div class="content">
<img src="https://webapp-pub.ezijing.com/project/marywood/school27.png" />
</div>
<div style="margin:auto;text-align:center;width:1200px;display:flex;justify-content:flex-start;margin-top:64px;margin-left:30px">
<div style="width: 6px;height: 34px;background: #AA1941;margin-right:9px;margin-top:6px"></div> <div style="width: 6px;height: 34px;background: #AA1941;margin-right:9px;margin-top:6px"></div>
<h1 style="color: #333333; font-size: 34px;font-weight: bold;">校园风光</h1> <h1 style="color: #333333; font-size: 34px;font-weight: bold;">校园风光</h1>
</div> </div>
...@@ -51,22 +41,27 @@ ...@@ -51,22 +41,27 @@
</div> </div>
</div> </div>
</div> </div>
<consultingForm :visible.sync="popupVisible" @success="hideApplyForm" @close="close" />
</div> </div>
</template> </template>
<script> <script>
import consultingForm from '../../components/consultingForm.vue'
export default { export default {
layout: 'normal', layout: 'normal',
components: { consultingForm },
data() { data() {
const _this = this const _this = this
return { return {
popupVisible: false,
listData: [ listData: [
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_zl1.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl1.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_zl2.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl2.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_zl3.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl3.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_zl4.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl4.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_zl5.png' } { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl5.png' }
], ],
swiperOption: { swiperOption: {
observer: true, observer: true,
...@@ -100,22 +95,65 @@ export default { ...@@ -100,22 +95,65 @@ export default {
}, },
swiperStart() { swiperStart() {
this.swiper.autoplay.start() this.swiper.autoplay.start()
},
showApplyForm() {
this.popupVisible = true
document.getElementsByTagName('body')[0].style.height = '100%'
document.getElementsByTagName('body')[0].style.overflow = 'hidden'
},
close() {
this.popupVisible = false
document.getElementsByTagName('body')[0].style.height = ''
document.getElementsByTagName('body')[0].style.overflow = ''
},
hideApplyForm() {
this.popupVisible = false
document.getElementsByTagName('body')[0].style.height = ''
document.getElementsByTagName('body')[0].style.overflow = ''
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.banner {
.btn {
display: flex;
justify-content: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 159px;
}
.btn1 {
width: 104px;
height: 32px;
border: 1px solid #ffffff;
font-size: 14px;
font-weight: 400;
line-height: 8px;
background: none;
color: #fff;
}
.btn1:hover {
background-color: #aa1941;
opacity: 1;
}
}
.content { .content {
width: 1200px; width: 1200px;
margin: auto; margin: auto;
text-align: center; text-align: center;
margin-top: 70px; margin-top: 70px;
img {
width: 100%;
height: 100%;
}
} }
.swiper-content { .swiper-content {
padding-top: 37px; padding-top: 37px;
padding-bottom: 132px;
// width: 100%; // width: 100%;
padding-bottom: 132px;
.swiper-slide { .swiper-slide {
position: relative; position: relative;
width: 388px; width: 388px;
...@@ -125,6 +163,7 @@ export default { ...@@ -125,6 +163,7 @@ export default {
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
line-height: 100%;
} }
} }
.swiper-slide-active { .swiper-slide-active {
......
pages/school/school3.vue
浏览文件 @ d3596b92
<template> <template>
<div> <div>
<img <div class="banner">
style="width:100%;height:100%" <img style="width:100%;height:100%" src="https://webapp-pub.ezijing.com/project/marywood/marywoo_banner.png" />
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywoo_banner.png" <div class="btn">
alt="" <el-button class="btn1" @click="showApplyForm">报名咨询</el-button>
/> </div>
<div class="content"> <div class="content">
<img <img class="img1" src="https://webapp-pub.ezijing.com/project/marywood/marywood31.png" />
style="width:1200px;height:661px;margin-top:10px;margin:auto;text-align:center" </div>
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood31.png"
alt=""
/>
</div> </div>
<img
style="padding-right:364px;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood32.png"
alt=""
/>
<img
style="margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood33.png"
alt=""
/>
<img <img
style="margin-top:68px;padding-left:368px;padding-right:368px" style="width:1200px;height:100%;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood34.png" class="img2"
alt="" src="https://webapp-pub.ezijing.com/project/marywood/marywood32.png"
/> />
<img <img
style="margin-top:64px" style="width:100%;height:100%;margin-top:68px"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood35.png" src="https://webapp-pub.ezijing.com/project/marywood/marywood33.png"
alt=""
/> />
<div class="content">
<img src="https://webapp-pub.ezijing.com/project/marywood/marywood34.png" />
</div>
<img <img
style="margin-top:68px;padding-left:368px;padding-right:368px" style="margin-top:64px;width:100%;height:100%"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood37.png" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/marywood36.png"
alt="" alt=""
/> />
<div style="display:flex;justify-content:flex-start;margin-left:360px;margin-top:64px"> <div class="content">
<img src="https://webapp-pub.ezijing.com/project/marywood/marywood37.png" />
</div>
<div style="width:1200px;margin:auto;text-align:center;display:flex;justify-content:flex-start;margin-top:64px;">
<div style="width: 6px;height: 34px;background: #AA1941;margin-right:9px;margin-top:6px"></div> <div style="width: 6px;height: 34px;background: #AA1941;margin-right:9px;margin-top:6px"></div>
<h1 style="color: #333333; font-size: 34px;font-weight: bold;">校园风光</h1> <h1 style="color: #333333; font-size: 34px;font-weight: bold;">校园风光</h1>
</div> </div>
...@@ -51,22 +42,27 @@ ...@@ -51,22 +42,27 @@
</div> </div>
</div> </div>
</div> </div>
<consultingForm :visible.sync="popupVisible" @success="hideApplyForm" @close="close" />
</div> </div>
</template> </template>
<script> <script>
import consultingForm from '../../components/consultingForm.vue'
export default { export default {
layout: 'normal', layout: 'normal',
components: { consultingForm },
data() { data() {
const _this = this const _this = this
return { return {
popupVisible: false,
listData: [ listData: [
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_mary1.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl1.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_mary2.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl2.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_mary3.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl3.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_mary4.png' }, { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl4.png' },
{ web_img_uri: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/school_mary5.png' } { web_img_uri: 'https://webapp-pub.ezijing.com/project/marywood/school_zl5.png' }
], ],
swiperOption: { swiperOption: {
observer: true, observer: true,
...@@ -100,21 +96,65 @@ export default { ...@@ -100,21 +96,65 @@ export default {
}, },
swiperStart() { swiperStart() {
this.swiper.autoplay.start() this.swiper.autoplay.start()
},
showApplyForm() {
this.popupVisible = true
document.getElementsByTagName('body')[0].style.height = '100%'
document.getElementsByTagName('body')[0].style.overflow = 'hidden'
},
close() {
this.popupVisible = false
document.getElementsByTagName('body')[0].style.height = ''
document.getElementsByTagName('body')[0].style.overflow = ''
},
hideApplyForm() {
this.popupVisible = false
document.getElementsByTagName('body')[0].style.height = ''
document.getElementsByTagName('body')[0].style.overflow = ''
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.banner {
.btn {
display: flex;
justify-content: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 159px;
}
.btn1 {
width: 104px;
height: 32px;
border: 1px solid #ffffff;
font-size: 14px;
font-weight: 400;
line-height: 8px;
background: none;
color: #fff;
}
.btn1:hover {
background-color: #aa1941;
opacity: 1;
}
}
.content { .content {
width: 1200px; width: 1200px;
margin: auto; margin: auto;
text-align: center; text-align: center;
margin-top: 70px; margin-top: 70px;
img {
width: 100%;
height: 100%;
}
} }
.swiper-content { .swiper-content {
padding-top: 37px; padding-top: 37px;
padding-bottom: 132px;
// width: 100%; // width: 100%;
padding-bottom: 132px;
.swiper-slide { .swiper-slide {
position: relative; position: relative;
width: 388px; width: 388px;
...@@ -124,6 +164,7 @@ export default { ...@@ -124,6 +164,7 @@ export default {
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
line-height: 100%;
} }
} }
.swiper-slide-active { .swiper-slide-active {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论