<style>
#papa {
margin: 0 0 0 calc(50% - 931px);
width: 1700px;
height: 900px;
top:130px;
background: url('https://pic.imgdb.cn/item/65a3ed50871b83018aa3da09.webp') no-repeat center/cover;
box-shadow: 3px 3px 20px #000;
position: relative;
z-index: 1;
display: grid;
place-items: center;
}
.mybox1 {
position: relative;
width: 1098px;
height: 449px;
left:-24px;
top:-6px;
background: url('https://pic.imgdb.cn/item/65a3daeb871b83018a48b06a.png') no-repeat center/cover;
}
.mybox1::before {
position: absolute;
content: '';
width: 100%;
height: 100%;
background: url('https://pic.imgdb.cn/item/65a3daf5871b83018a48dc91.png') no-repeat center/cover;
-webkit-mask: linear-gradient(45deg, red 20%, transparent 80%, transparent 0);
animation: clipCircleIn 10s alternate infinite forwards;
}
@keyframes clipCircleIn {
0% {
clip-path: polygon(50% 100%, 50% 0%, 0% 0%, 100% 0%, 50% 0%);
}
50% {
clip-path: polygon(50% 100%, 0% 0%, 0% 0%, 100% 0%, 100% 0%);
}
100% {
clip-path: polygon(50% 100%, 0% 100%, 0% 0%, 100% 0%, 100% 100%);
}
}
#papa video {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
clip-path: polygon(0 0, 84% 0, 90% 10%, 120% 10%, 100% 100%, 0 60%);
transform: scale(-1,1);
mix-blend-mode: screen;
}
</style>
<div id="papa"><div class="mybox1"></div>
<video src="https://img.tukuppt.com/video_show/15653652/01/22/70/620f1032eee1f.mp4" muted loop></video>
</div>
<script>
var sf = document.createElement('script');
sf.src = 'https://638183.freep.cn/638183/web/api/ypPlayer.min.js';
sf.charset = 'utf-8';
document.body.appendChild(sf);
sf.onload = () => {
let player = new ypP();
player.setAudSrc('http://www.kumeiwp.com/sub/filestores/2024/01/30/77e442274e6abeb63c52f0e4ff9a891c.mp3');
player.setBtnCss(`
width: 300px;
bottom: 10px;
opacity: .6;
--btnBg: url('https://638183.freep.cn/638183/web/svg/7c-umbrella.svg') no-repeat center/cover;
--btnSize: 50px;
--progBg: Pink;
--trackBg: transparent;
`);
player.setLrcCss(`top: 15px; color: rgba(250,250,250,.4); --bg: url('https://pic.imgdb.cn/item/65a3e4f1871b83018a7c76c7.jpg'); font-size: 2.0em;`);
player.lrcAr = [
[1.04,"单曲：花旦 ",0.9],
[1.93,"歌手：周华健",0.9],
[2.82,"所属专辑：周华健 侠客行·专场",1.0],
[3.78,"作词 : 娃娃",1.2],
[4.94,"作曲 : 黄韵仁/屠颍/周华健",2.0],
[6.94,"学习黑师《半壶纱》&遮罩效果",3.2],
[25.88,"美美入戏已太深",2.7],
[30.62,"一步一步颠倒众生",2.7],
[35.83,"假假真真 付出岁月青春",4.0],
[39.88,"那情意你可得到几分",4.9],
[44.82,"花花舞台多缤纷",5.1],
[49.95,"走着走着岁月无痕",2.6],
[53.86,"浮浮沉沉 爱恨回荡歌声",6.0],
[59.97,"惹得你忘了现实的真",3.0],
[62.82,"也许 千帆过了还在等",4.1],
[67.92,"也许 笑眼泪光盼到那个人",3.8],
[71.86,"也许 动了我的情 乱了你的心",5.8],
[77.85,"蓦然回首是谁的人生",3.7],
[81.81,"也许 抖落了一身风尘",4.3],
[87.05,"也许 不到白头热情不会冷",3.8],
[90.87,"也许 幻化了乾坤 迎来了掌声",6.0],
[97.87,"歌声悠悠 流过梦一样人生",5.7],
[125.86,"美美入戏已太深",5.7],
[131.59,"一步一步颠倒众生",3.1],
[136.25,"假假真真 付出岁月青春",4.6],
[140.81,"那情意你可得到几分",3.4],
[145.83,"花花舞台多缤纷",2.7],
[150.63,"走着走着岁月无痕",2.7],
[155.56,"浮浮沉沉 爱恨回荡歌声",4.9],
[160.41,"惹得你忘了现实的真",2.9],
[164.04,"也许 千帆过了还在等",3.7],
[168.68,"也许 笑眼泪光盼到那个人",3.8],
[173.43,"也许 动了我的情 乱了你的心",5.0],
[179.49,"蓦然回首是谁的人生",2.9],
[182.96,"也许 抖落了一身风尘",4.1],
[187.83,"也许 不到白头热情不会冷",4.0],
[192.69,"也许 幻化了乾坤 迎来了掌声",4.9],
[198.7,"歌声悠悠 流过梦一样人生",5.6],
[206.82,"也许 千帆过了还在等",5.0],
[211.81,"也许 笑眼泪光盼到那个人",4.9],
[216.68,"也许 动了我的情 乱了你的心",4.9],
[221.86,"蓦然回首是谁的人生",3.8],
[225.8,"也许 抖落了一身风尘",4.3],
[231.00,"也许 不到白头热情不会冷",4.0],
[235.89,"也许 唱落你的泪 唱开你的笑",5.0],
[241.88,"为你歌唱就是我要的 人生",6.2]
];
};
</script>
<br><br><br><br><br><br><br><br>
发表于 2024-2-20 19:38
发表于 2024-2-20 19:39
