chenkainan
12 months ago
7 changed files with 743 additions and 4 deletions
@ -0,0 +1,230 @@ |
|||||
|
<template> |
||||
|
<view class="bg scroll" v-if="detail.list_images" :style="{backgroundImage: 'url('+showImg(detail.list_images.split(',')[0])+')'}"> |
||||
|
<view class="topLeft flex-center"> |
||||
|
<span class="iconfont" @click="goBack"></span> |
||||
|
</view> |
||||
|
|
||||
|
<view class="content"> |
||||
|
<view class="title">{{detail.title}}</view> |
||||
|
<view class="subtitle">{{detail.subtitle}}</view> |
||||
|
<view class="notice"> |
||||
|
<uni-notice-bar showIcon scrollable single :text="detail.open_description" color="#fff" |
||||
|
background-color="rgba(255, 255, 255, .26)" speed="50"></uni-notice-bar> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 音视频 --> |
||||
|
<view class="box"> |
||||
|
<view>景点解说</view> |
||||
|
<view> |
||||
|
<view v-for="(item,index) in detail.multimedia" :key="index" class="item" @click="play(item,index)"> |
||||
|
<image :src="showImg(item.head_img)" mode="aspectFill" class="item-img"></image> |
||||
|
<view class="item-title text-overflow">{{item.title}}</view> |
||||
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/sound.png" class="item-icon" v-if="item.type == 'audio' && !item.status"></image> |
||||
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/pause.png" class="item-icon" v-if="item.type == 'audio' && item.status"></image> |
||||
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/play.png" class="item-icon" v-if="item.type == 'video'"></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
detail: {}, |
||||
|
audio: null, |
||||
|
isPlayIndex: null |
||||
|
} |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.Post({ |
||||
|
id: option.id |
||||
|
}, '/api/scenic/getScenicById').then(res => { |
||||
|
if (res.data.flag == 0) { |
||||
|
uni.showToast({ |
||||
|
title: '商品不存在或已下架', |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
setTimeout(() => { |
||||
|
this.goBack() |
||||
|
}, 2000) |
||||
|
} |
||||
|
res.data.multimedia.map(item => { |
||||
|
item.type = item.multimedia_url.includes('mp3') ? 'audio' : 'video' |
||||
|
item.status = false // 是否播放 |
||||
|
}) |
||||
|
this.detail = res.data |
||||
|
}); |
||||
|
}, |
||||
|
onShow() { |
||||
|
this.isPlayIndex = null |
||||
|
}, |
||||
|
onHide() { |
||||
|
if(this.audio){ |
||||
|
// 停止播报（销毁当前实例） |
||||
|
this.audio.destroy() |
||||
|
} |
||||
|
}, |
||||
|
onUnload() { |
||||
|
if(this.audio){ |
||||
|
// 停止播报（销毁当前实例） |
||||
|
this.audio.destroy() |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// 播放音视频 |
||||
|
play(item,index) { |
||||
|
if(item.type == 'audio') { |
||||
|
// 判断新音频链接是否与正在播放链接相同 |
||||
|
if(this.audio && this.audio.src == this.showImg(item.multimedia_url)) { |
||||
|
// 当前是否是暂停或停止状态，true 表示暂停或停止，false 表示正在播放 |
||||
|
if(this.audio.paused) { |
||||
|
this.audio.play() |
||||
|
}else { |
||||
|
this.audio.pause() |
||||
|
} |
||||
|
}else { |
||||
|
// 是否存在audio组件 |
||||
|
if(this.audio) { |
||||
|
// 如果存在停止音频 |
||||
|
this.detail.multimedia[this.isPlayIndex].status = false |
||||
|
this.audio.stop(); // 停止当前音频 |
||||
|
this.audio = null; |
||||
|
} |
||||
|
// 不存在，创建音频 |
||||
|
this.audio = uni.createInnerAudioContext(); |
||||
|
this.audio.src = this.showImg(item.multimedia_url) |
||||
|
this.audio.play() |
||||
|
|
||||
|
} |
||||
|
if(this.audio) { |
||||
|
this.audio.onEnded(() => { |
||||
|
// 播放结束 |
||||
|
item.status = false |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
this.isPlayIndex = index |
||||
|
item.status = !item.status |
||||
|
|
||||
|
}else { |
||||
|
uni.navigateTo({ |
||||
|
url: '/subPackages/video/video?item=' + encodeURIComponent(JSON.stringify(item)) |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.bg { |
||||
|
width: 100vw; |
||||
|
height: 100vh; |
||||
|
background-size: auto 100%; |
||||
|
animation: scroll 10s infinite; |
||||
|
overflow: hidden; |
||||
|
background-repeat: no-repeat; |
||||
|
} |
||||
|
|
||||
|
@keyframes scroll { |
||||
|
0% { |
||||
|
background-position: 0%; |
||||
|
} |
||||
|
|
||||
|
100% { |
||||
|
background-position: -1000px; |
||||
|
} |
||||
|
|
||||
|
/* 500px 是背景图片宽度的一半 */ |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
width: 670rpx; |
||||
|
position: absolute; |
||||
|
top: 235rpx; |
||||
|
left: 40rpx; |
||||
|
|
||||
|
.title { |
||||
|
font-weight: 500; |
||||
|
font-size: 48rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.subtitle { |
||||
|
margin-top: 35rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 31rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.notice { |
||||
|
margin-top: 35rpx; |
||||
|
height: 80rpx; |
||||
|
border-radius: 33rpx; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.box { |
||||
|
position: absolute; |
||||
|
bottom: 79rpx; |
||||
|
width: 100%; |
||||
|
padding-left: 42rpx; |
||||
|
|
||||
|
&>view:first-child { |
||||
|
font-weight: 500; |
||||
|
font-size: 37rpx; |
||||
|
color: #FFFFFF; |
||||
|
padding-left: 12rpx; |
||||
|
} |
||||
|
|
||||
|
&>view:last-child { |
||||
|
overflow-x: scroll; |
||||
|
overflow-y: hidden; |
||||
|
font-weight: bold; |
||||
|
font-size: 31rpx; |
||||
|
color: #FFFFFF; |
||||
|
display: flex; |
||||
|
margin-top: 28rpx; |
||||
|
} |
||||
|
&>view:last-child::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
.item { |
||||
|
width: 206rpx; |
||||
|
height: 254rpx; |
||||
|
background: rgba(255, 255, 255, .4); |
||||
|
border-radius: 20rpx; |
||||
|
margin-right: 20rpx; |
||||
|
padding: 8rpx; |
||||
|
flex-shrink: 0; |
||||
|
position: relative; |
||||
|
|
||||
|
.item-img { |
||||
|
width: 190rpx; |
||||
|
height: 190rpx; |
||||
|
border-radius: 13rpx; |
||||
|
} |
||||
|
|
||||
|
.item-title { |
||||
|
width: 190rpx; |
||||
|
font-weight: bold; |
||||
|
font-size: 31rpx; |
||||
|
color: #FFFFFF; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.item-icon { |
||||
|
position: absolute; |
||||
|
width: 46rpx; |
||||
|
height: 46rpx; |
||||
|
top: 80rpx; |
||||
|
left: 80rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,153 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<swiper class="swiper-box" :circular="true" previous-margin="0" next-margin="70rpx" :duration="800" |
||||
|
:current="current" @change="swiperChange"> |
||||
|
<swiper-item v-for="(item, index) in list" :key="index" class="swiper-item"> |
||||
|
<view class="swiper-item" :class="['swiper-item', {'active': index == current}]"> |
||||
|
<image :src="showImg(item.image)" mode="aspectFill" class="swiper-img"></image> |
||||
|
<view class="content"> |
||||
|
<view class="title text-overflowRows">{{item.title}}</view> |
||||
|
<view class="tags" v-if="item.label"> |
||||
|
<view class="tag" v-for="(tagItem, tagIndex) in item.label.split(',').slice(0,2)" :key="tagIndex">{{tagItem}}</view> |
||||
|
</view> |
||||
|
<view class="address text-overflowRows" v-if="item.address"> |
||||
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/location.png" mode=""></image> |
||||
|
{{item.address}} |
||||
|
</view> |
||||
|
<navigator :url="'/subPackages/leyou/detail?id='+item.id" class="btn"> |
||||
|
查看更多 > |
||||
|
</navigator> |
||||
|
</view> |
||||
|
</view> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
list: [], |
||||
|
current: 0, |
||||
|
} |
||||
|
}, |
||||
|
onShow() { |
||||
|
this.getList() |
||||
|
}, |
||||
|
methods: { |
||||
|
getList() { |
||||
|
https://tlgz.sz-trip.com?scenic_type_id=11&offset=0&limit=10&lon=120&lat=30&token=96035795-fe93-4db8-8cf3-aeabbdb4e8c4 |
||||
|
this.Post({ |
||||
|
scenic_type_id: 12, |
||||
|
offset: 0, |
||||
|
limit: 100 |
||||
|
},'/api/Scenic/getScenicByType').then(res => { |
||||
|
this.list = res.data |
||||
|
}) |
||||
|
}, |
||||
|
//轮播图左右滑动 |
||||
|
swiperChange(e) { |
||||
|
let { |
||||
|
current, |
||||
|
source |
||||
|
} = e.detail; |
||||
|
//在自动或手动的时候才赋予current值 |
||||
|
if (source === 'autoplay' || source === 'touch') { |
||||
|
this.current = current; |
||||
|
} |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.bg { |
||||
|
min-height: 100vh; |
||||
|
padding: 40rpx 0 0 40rpx; |
||||
|
} |
||||
|
|
||||
|
.swiper-box { |
||||
|
height: 1267rpx; |
||||
|
|
||||
|
.swiper-item { |
||||
|
width: 640rpx; |
||||
|
height: 1267rpx; |
||||
|
border-radius: 27rpx; |
||||
|
position: relative; |
||||
|
|
||||
|
.swiper-img { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
border-radius: 27rpx; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
transform: scale(0.9); |
||||
|
} |
||||
|
|
||||
|
.active { |
||||
|
width: 640rpx; |
||||
|
height: 1267rpx; |
||||
|
|
||||
|
.swiper-img { |
||||
|
transform: scale(1); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
position: absolute; |
||||
|
width: 530rpx; |
||||
|
left: 40rpx; |
||||
|
bottom: 50rpx; |
||||
|
|
||||
|
.title { |
||||
|
font-weight: 500; |
||||
|
font-size: 44rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.tags { |
||||
|
display: flex; |
||||
|
margin-top: 28rpx; |
||||
|
|
||||
|
.tag { |
||||
|
line-height: 47rpx; |
||||
|
border-radius: 8rpx; |
||||
|
border: 1rpx solid #FFFFFF; |
||||
|
padding: 0 12rpx; |
||||
|
margin-right: 20rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 27rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.address { |
||||
|
font-weight: 500; |
||||
|
font-size: 32rpx; |
||||
|
color: #FFFFFF; |
||||
|
margin-top: 28rpx; |
||||
|
|
||||
|
image { |
||||
|
width: 30.67rpx; |
||||
|
height: 36.67rpx; |
||||
|
vertical-align: middle; |
||||
|
margin-right: 10rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
width: 253rpx; |
||||
|
line-height: 73rpx; |
||||
|
background: rgba(255, 255, 255, .26); |
||||
|
border-radius: 37rpx; |
||||
|
text-align: center; |
||||
|
font-weight: 500; |
||||
|
font-size: 32rpx; |
||||
|
color: #FFFFFF; |
||||
|
margin-top: 28rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,105 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<view class="topLeft flex-center"> |
||||
|
<span class="iconfont" @click="goBack"></span> |
||||
|
</view> |
||||
|
|
||||
|
<swiper class="swiper" :autoplay="true" :interval="3000" :duration="1000" circular indicator-dots indicator-color="rgba(255,255,255,.5)" |
||||
|
indicator-active-color="#fff" v-if="detail.images"> |
||||
|
<swiper-item v-for="(item, index) in detail.images.split(',')" :key="item.id"> |
||||
|
<view class="swiper-item"> |
||||
|
<image class="item-img" :src="showImg(item)" mode="aspectFill"></image> |
||||
|
</view> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
|
||||
|
<view class="topBox"> |
||||
|
<view class="title text-overflowRows">{{detail.title}}</view> |
||||
|
<view class="name"> |
||||
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/noveltyUser.png" mode=""></image> |
||||
|
{{detail.author}} |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="content" v-html="formateRichText(detail.content)"></view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
detail: {} |
||||
|
} |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
this.Post({id: option.id},'/api/article/getArticleById').then(res => { |
||||
|
if (res.data.flag == 0) { |
||||
|
uni.showToast({title: '文章不存在或已下架',icon: 'none'}) |
||||
|
setTimeout(() => {this.goBack()}, 2000) |
||||
|
} |
||||
|
this.detail = res.data; |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.bg { |
||||
|
width: 750rpx; |
||||
|
min-height: 100vh; |
||||
|
background: #F7F7F7; |
||||
|
padding-bottom: 100rpx; |
||||
|
} |
||||
|
|
||||
|
.swiper { |
||||
|
height: 500rpx; |
||||
|
|
||||
|
.swiper-item { |
||||
|
width: 100%; |
||||
|
height: 500rpx; |
||||
|
|
||||
|
.item-img { |
||||
|
width: 750rpx; |
||||
|
height: 500rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.topBox { |
||||
|
width: 697rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 22rpx 48rpx 34rpx 26rpx; |
||||
|
margin: 26rpx auto 0; |
||||
|
|
||||
|
.title { |
||||
|
font-weight: bold; |
||||
|
font-size: 35rpx; |
||||
|
color: #000000; |
||||
|
} |
||||
|
|
||||
|
.name { |
||||
|
font-weight: 500; |
||||
|
font-size: 25rpx; |
||||
|
color: #666666; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
margin-top: 35rpx; |
||||
|
|
||||
|
image { |
||||
|
width: 23.33rpx; |
||||
|
height: 23.33rpx; |
||||
|
margin-right: 12rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
width: 697rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
margin: 42rpx auto 0; |
||||
|
padding: 36rpx 28rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,147 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<view class="topLeft flex-center"> |
||||
|
<span class="iconfont" @click="goBack"></span> |
||||
|
</view> |
||||
|
<img :src="showImg(headImg)" class="topImg" /> |
||||
|
|
||||
|
<view v-for="(item,index) in list" :key="index" class="item"> |
||||
|
<view class="item-left"> |
||||
|
<view>{{item.discounts / 100}}</view> |
||||
|
<view>满{{item.min_limit / 100}}可用</view> |
||||
|
</view> |
||||
|
<view class="item-right flex-column"> |
||||
|
<view>{{item.discounts / 100}}元优惠券</view> |
||||
|
<view class="subtitle text-overflow">有效期：{{item.open_time.slice(0,10)}}-{{item.end_time.slice(0,10)}}</view> |
||||
|
<view class="flex-between"> |
||||
|
<view class="subtitle" @click="note = item.note;$refs.popupRule.open()">使用规则 ></view> |
||||
|
<view class="btn" @click="getCoupon(item.id)">立即领取</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<uni-popup ref="popupRule" type="center"> |
||||
|
<view class="rule-box" > |
||||
|
{{note}} |
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
list:[], |
||||
|
headImg: '', |
||||
|
note: '' |
||||
|
} |
||||
|
}, |
||||
|
onReady() { |
||||
|
this.getHeadImg('line').then(res => {this.headImg = res}) |
||||
|
}, |
||||
|
onShow() { |
||||
|
this.getList() |
||||
|
}, |
||||
|
methods: { |
||||
|
getList() { |
||||
|
this.Post({ |
||||
|
tag_id: 2 |
||||
|
},'/api/coupon/getTagCouponActList').then(res => { |
||||
|
this.list = res.data |
||||
|
}) |
||||
|
}, |
||||
|
// 领取优惠券 |
||||
|
getCoupon(id) { |
||||
|
this.Post({ |
||||
|
ids: id |
||||
|
},'/api/coupon/getCouponsByActivityIds').then(res => { |
||||
|
if(res.code == 1) { |
||||
|
uni.showToast({ |
||||
|
title: '优惠券领取成功!', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.bg { |
||||
|
min-height: 100vh; |
||||
|
background: #FFFFFF; |
||||
|
padding-bottom: 200rpx; |
||||
|
} |
||||
|
|
||||
|
.topImg { |
||||
|
width: 100%; |
||||
|
height: 440rpx; |
||||
|
} |
||||
|
|
||||
|
.item { |
||||
|
width: 696.67rpx; |
||||
|
height: 200rpx; |
||||
|
background-image: url('https://static.ticket.sz-trip.com/tongli/images/index/couponBg.png'); |
||||
|
background-size: 100% 100%; |
||||
|
margin: 27rpx auto 0; |
||||
|
padding: 0 20rpx 0 50rpx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
|
||||
|
.item-left { |
||||
|
padding: 45rpx 0 29rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: space-between; |
||||
|
font-weight: 500; |
||||
|
font-size: 27rpx; |
||||
|
color: #FFFFFF; |
||||
|
text-align: center; |
||||
|
|
||||
|
&>view:first-child { |
||||
|
font-weight: bold; |
||||
|
font-size: 57rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
&>view:first-child::before { |
||||
|
font-size: 32rpx; |
||||
|
content: '￥'; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.item-right { |
||||
|
width: 410rpx; |
||||
|
height: 200rpx; |
||||
|
padding: 25rpx 0 20rpx; |
||||
|
font-weight: bold; |
||||
|
font-size: 32rpx; |
||||
|
color: #111111; |
||||
|
justify-content: space-between; |
||||
|
|
||||
|
.subtitle { |
||||
|
font-weight: 400; |
||||
|
font-size: 25rpx; |
||||
|
color: #333333; |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
width: 140rpx; |
||||
|
line-height: 51rpx; |
||||
|
background: linear-gradient(0deg, #FC5109, #FC930A); |
||||
|
border-radius: 25rpx; |
||||
|
text-align: center; |
||||
|
font-weight: 500; |
||||
|
font-size: 27rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.rule-box { |
||||
|
width: 70vw; |
||||
|
padding: 20rpx; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,59 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<video :src="showImg(src)" controls class="myVideo" :poster="poster"></video> |
||||
|
<view class="title"> |
||||
|
{{title}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
src: '', |
||||
|
poster: '', |
||||
|
title: '' |
||||
|
} |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
const item = JSON.parse(decodeURIComponent(option.item)); |
||||
|
this.src = item.multimedia_url |
||||
|
this.poster = item.head_img |
||||
|
this.title = item.title |
||||
|
}, |
||||
|
onReady() { |
||||
|
uni.setNavigationBarTitle({ |
||||
|
title: this.title |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.bg { |
||||
|
width: 100%; |
||||
|
height: 100vh; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.myVideo { |
||||
|
width: 100%; |
||||
|
height: 100vh; |
||||
|
position: absolute; |
||||
|
top: 50%; |
||||
|
left: 50%; |
||||
|
transform: translate(-50%,-50%); |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
width: 699rpx; |
||||
|
font-family: PingFang SC; |
||||
|
font-weight: 500; |
||||
|
font-size: 29rpx; |
||||
|
color: #FFFFFF; |
||||
|
position: fixed; |
||||
|
left: 28rpx; |
||||
|
bottom: 140rpx; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue