醉美水芙蓉 发表于 4 天前

又是一年流苏开

<style>
        @import 'https://638183.freep.cn/638183/web/mod/btn_lrc.css';
        #tz { --state: running; width: 1280px; height: 720px;margin: 30px 0 30px calc(50% - 721px); background: url('https://bbs.cnzv.cc/up/upload/pic/12/20250114-e6dd44f747457b5c940ee827ceeb2674.jpg') no-repeat center/cover;overflow: hidden; }
   #tz::before{ position: absolute;left: -35px; top:-45px;content:url('https://bbs.cnzv.cc/up/upload/pic/12/20250114-7c26930fdd4f8b5029cdf69daf2af289.gif');mix-blend-mode:darken;z-index: 5; animation: swing 2s infinite var(--state); }
        @keyframes swing {
0% {
    transform: rotate(-2deg);
}
50% {
    transform: rotate(2deg);
}
100% {
    transform: rotate(-2deg);
}
}
        #vid { top: -120px;height:120%; overflow: hidden;}
      #fsbtn { top: 20px;Right: 20px; font:normal 1.2em 华文新魏;color:#228B22;box-shadow: 2px 2px 4px #000; }
        #lrc,#lrcc{--state: paused;--motion: cover2;--tt: 2s;--bg:linear-gradient(89deg,
    #EE0000 12%,#078504 35%,#060344 65%,#DE0000 90%);border:0px solid black;position: absolute;z-index: 6;font:normal 2.8em 华文新魏;color:#228B22;white-space: pre;-webkit-background-clip: text;filter:drop-shadow(#ffffff 1px 0 0)drop-shadow(#ffffff 0 1px 0)drop-shadow(#ffffff -1px 0 0) drop-shadow(#ffffff 0 -1px 0);z-index: 15;}
    #lrc{position: absolute;width: 80%; height: 55px; top: 88%;color: #ff0000;left:10%; font:bold 2.2em 华文隶书; text-align: center;filter:drop-shadow(#ffffff 1px 0 0)drop-shadow(#ffffff 0 1px 0)drop-shadow(#ffffff -1px 0 0) drop-shadow(#ffffff 0 -1px0);}
    #lrcc {left: 85%;transform: translate(-102%);top: 85%;}
    #lrcc::before,#lrc::before {position: absolute;content: attr(data-lrc);width: 100%;height: 100%;color: transparent;overflow: hidden;white-space: pre;background: var(--bg); clip-path: inset(0% 100% 0 0); -webkit-background-clip: text;animation: var(--motion) var(--tt) linear forwards;animation-play-state: var(--state);}
    @keyframes cover2 {to { clip-path: inset(0 0 0 0);}}
      #tz:hover #mplayer { transition: .7s; opacity: .9; }
        #mplayer { left: 2%; top: 35%;width: 400px; height: 400px; display: grid; place-items: center;z-index: 11;animation: spin 18s linear infinite var(--state); }
@keyframes spin {
      0% { transform: rotate(360deg)scale(0.8);filter:hue-rotate(360deg)contrast(100%)brightness(200%); } 50% { transform: rotate(0deg)scale(0.8);filter:hue-rotate(0deg)contrast(100%)brightness(100%); opacity: 1;}100% { transform: rotate(-360deg)scale(0.8);filter:hue-rotate(0deg)contrast(100%)brightness(100%); opacity: 0.5;}
}       
</style>
<div id="tz" class="pa">
<div id="mplayer"class="mplayer"><svg width="400" height="400">
      <polygonpoints="400.00,200.00 2.04,171.54 391.90,256.35 18.07,116.92 368.25,308.13 48.85,69.03 330.97,351.15 91.87,31.75 283.08,381.93 143.65,8.10 228.46,397.96 200.00,0.00 171.54,397.96 256.35,8.10 116.92,381.93 308.13,31.75 69.03,351.15 351.15,69.03 31.75,308.13 381.93,116.92 8.10,256.35 397.96,171.54 0.00,200.00 397.96,228.46 8.10,143.65 381.93,283.08 31.75,91.87 351.15,330.97 69.03,48.85 308.13,368.25 116.92,18.07 256.35,391.90 171.54,2.04 200.00,400.00 228.46,2.04 143.65,391.90 283.08,18.07 91.87,368.25 330.97,48.85 48.85,330.97 368.25,91.87 18.07,283.08 391.90,143.65 2.04,228.46" fill-rule="nonzero | evenodd" fill="#ff0000" stroke="#00f000" stroke-width="1" />
       </svg></div>
        <audio src="https://cccimg.com/view.php/b47bb03a4148f488771bfa8454caada0.mp3"loop autoplay></audio>
        <video class="vid" src="https://img-baofun.zhhainiao.com/pcwallpaper_ugc/preview/9f39f9e98ca0528e5470cbed2845dd5a_preview.mp4" autoplay loop muted></video>
    <video class="vid"   id="vid" src="https://img.tukuppt.com/video_show/2418175/01/49/21/6355e21544a03.mp4" autoplay loop muted></video>
<div id="lrc" class="lrc" data-lrc="HCPlayer"></div>
        <div id="mplayer" class="mplayer"></div>
        <div id="fsbtn" class="fsbtn"></div>
</div>
<script type="module">
        import { hcplay } from 'https://638183.freep.cn/638183/web/mod/btn_lrc.js';
        import fscreen from 'https://638183.freep.cn/638183/web/mod/fscreen.js';
        var lrcAr = [
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
        hcplay(tz, lrcAr);
        fscreen.fs(tz, fsbtn);
</script >

klxf 发表于 3 天前

漂亮！谢谢醉美管理员精彩分享:)

醉美水芙蓉 发表于 3 天前

klxf 发表于 2025-1-15 14:01
漂亮！谢谢醉美管理员精彩分享

谢谢友友光临！

醉美水芙蓉 发表于 3 天前

精彩的画面,让人耳目一新,非常有创意作品,上茶,祝好.
页: [1]
查看完整版本: 又是一年流苏开