diff --git a/src/assets/img/danceImg.jpg b/src/assets/img/danceImg.jpg new file mode 100644 index 0000000..b68ff8d Binary files /dev/null and b/src/assets/img/danceImg.jpg differ diff --git a/src/components/home/home.vue b/src/components/home/home.vue index f2ecfa8..7c4e764 100644 --- a/src/components/home/home.vue +++ b/src/components/home/home.vue @@ -19,14 +19,10 @@
-
+
-
- +
-
+ + +
+
+ +
@@ -322,11 +337,14 @@ export default { }, data() { return { + isAndroid: false, //判断是不是ios inPage: false, loading: false, // 加载状态 videoUrl: '', // 视频路径 + videoUrl2: '', // 视频路径 isVX: null, //判断是不是微信浏览器 videoPlayBtn: true, // 播放按钮显示隐藏 + videoPlayBtn2: true, // 播放按钮显示隐藏 userName: '', phone: '', email: '', @@ -522,6 +540,10 @@ export default { this.videoPlayBtn = false; document.getElementById('video').play(); }, + playVideo2() { + this.videoPlayBtn2 = false; + document.getElementById('video2').play(); + }, goLogin() { this.$router.push('/myPage'); return; @@ -615,7 +637,6 @@ export default { }) }, created() { - // console.log(!getDeviceType()); // 判断是不是微信浏览器,配合做视频的自动播放 var ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == 'micromessenger') { @@ -625,6 +646,20 @@ export default { this.isVX = false; return false; } + const deviceType = getDeviceType(); + this.isAndroid = false; + if (!deviceType) { + // 设备类型为pc + this.isAndroid = false; + } else { + if (deviceType[0] == 'Android') { + // 设备类型为安卓 + this.isAndroid = true; + } else { + // 其他设备 + this.isAndroid = false; + } + } }, mounted() { this.goView('top'); @@ -634,6 +669,8 @@ export default { this.carouselLsit = twoList; this.partnerLsit = threeList; this.videoUrl = 'https://video.metavatar.cc/sv/d51a6f6-187fa2dff79/d51a6f6-187fa2dff79.mp4'; + this.videoUrl2 = 'https://video.metavatar.cc/sv/549c903-18843089e4c/549c903-18843089e4c.mp4'; + // this.videoUrl2 = 'https://video.metavatar.cc/sv/26e58b0-188465a550e/26e58b0-188465a550e.mp4'; // 监听点击来播放视频,微信浏览器禁用自动播放 this.loading = true; // document.getElementById('video').play(); @@ -950,8 +987,10 @@ export default { } .module_3 { + position: relative; overflow: hidden; background-color: #202020; + .imgBox1 { width: 100%; height: 228px; @@ -972,6 +1011,12 @@ export default { height: 100%; } } + .imgBox3 { + position: relative; + width: 100%; + height: 228px; + // background-color: #16e9d6; + } } .module_4 { overflow: hidden;