本帖最后由 花简静 于 2025-1-11 08:43 编辑
<style>
@import 'https://638183.freep.cn/638183/web/mod/button.css';
#tz { --state: running; margin: 130px 0 30px calc(50% - 931px); width:1700px; height: 900px; background: url('http://qslt.net/data/attachment/forum/202501/10/%E4%BC%A0%E5%9B%BE%E8%AF%95%E5%B8%96/212401ez6c44v6sf65zg56.jpg') no-repeat center/cover; }
#fsbtn { bottom: 20px; }
.mplayer {
left: calc(28% - 308px); top: calc(77% - 60px);opacity: .66;
}
.vid { position: absolute; mix-blend-mode:multiply;opacity: .36;width:78%;left:0px;-webkit-mask: linear-gradient(to bottom,transparent,transparent,transparent,red);}
.mypic {
position: absolute;
left:130px;
top:420px;
cursor: pointer;
mix-blend-mode: Multiply;
z-index: 3;
}
</style>
<div id="tz" class="pa">
<audio src="https://music.163.com/song/media/outer/url?id=304966"></audio>
<video class="vid" src="https://bpic.588ku.com/video_listen/588ku_preview/24/03/29/15/01/16/video6606673cc6a03.mp4" autoplay loop muted></video>
<div id="fsbtn" class="fsbtn"></div>
<div class="mypic"><img src="http://qslt.net/data/attachment/forum/202412/22/185517gclz9lzqcokzqcuz.gif" alt="" /></div>
<svg id="msvg" class="mplayer" width="200" height="200"></svg>
</div>
<script type="module">
import { hcplay } from 'https://638183.freep.cn/638183/web/mod/button.js';
import Dr from 'https://638183.freep.cn/638183/web/mod/svgdr.js';
import fscreen from 'https://638183.freep.cn/638183/web/mod/fscreen.js';
var dr = Dr.dr('msvg');
var all = 21, a = 360 / all;
dr.symbol('sym','-100 -100 200 200');
for(var i = 0; i < all; i ++) {
var c = Math.random().toString(16).substring(2,8)
dr.path('M0 0 Q60 -80,40 20','none',`#${c}`,1.1).transform(`rotate(${i * a},0,0) translate(10)`).addTo('sym');
}
dr.use('#sym',0,0,200,200);
hcplay(tz);
fscreen.fs(tz, fsbtn);
</script>
|