yangprivate-web/kdofficial
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 32 Wiki Activity

主页视频更名,视频banner统一管理

Browse Source
This commit is contained in:
zhcnyuyang 2025-05-15 14:49:08 +08:00
parent 4ad6d8a350
commit d9eb7cb1c6
3 changed files with 44 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/ExpVideo.mp4 Normal file
View File

Binary file not shown.

32
src/components/Homepage.vue
View File

@ -4,11 +4,11 @@ import Partners from './Tools/Partners.vue'
</script>
<template>
<div id="homepageroot" class="pageroot">
<div id="homepagebanner" style="width: 100%;height: auto;background-color: black; position: relative">
<video poster="/bannervideopreload.png" controls="" id="bannervideo" muted autoplay="autoplay" loop="loop" playsinline webkit-playsinline style="width: 100%;z-index: 0;">
<div id="homepagebanner" class="videorootbanner">
<video poster="/bannervideopreload.png" controls="" id="bannervideo" muted autoplay="autoplay" loop="loop" playsinline webkit-playsinline class="bannervideos">
<source src="/HpgVideo.mp4" type="video/mp4"></source>
</video>
<div id="hpbanner">
<div id="hpbanner" class="bannerovervideo">
<div class="bannercontent">
<span class="banner1">为用户创造美好体验<br /></span>
<span class="banner2">驱动商业可持续增长</span>
@ -201,19 +201,19 @@ export default {
}
#hpbanner{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin-left: 0;
margin-top: 0;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: flex-start;
z-index: 2;
pointer-events: none;
//position: absolute;
//top: 0;
//left: 0;
//width: 100%;
//height: 100%;
//margin-left: 0;
//margin-top: 0;
//background-color: rgba(0, 0, 0, 0.5);
//display: flex;
//align-items: center;
//justify-content: flex-start;
//z-index: 2;
//pointer-events: none;
}
#secondwhite

28
src/publicstyle.scss
View File

@ -34,6 +34,34 @@
}
}
.videorootbanner{
width: 100%;
height: auto;
background-color: black;
position: relative
}
.bannervideos{
width: 100%;
z-index: 0;
}
.bannerovervideo{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin-left: 0;
margin-top: 0;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: flex-start;
z-index: 2;
pointer-events: none;
}
.bannercontent{
text-align: left;
position: relative;