小辣椒 发表于 2024-5-16 20:36

小和尚念经


<meta charset="UTF-8">
<style>
        #tiezi { margin: 150px 0 10px calc(50% - 781px);width: 1400px; height: 820px; background: url('https://xlaj.cn/assets/file/zp/20240516171502.jpg') no-repeat center/cover; box-shadow: 3px 3px 6px #000; overflow: hidden; z-index: 1; display: grid; place-items: center; position: relative; }
        #tiezi > canvas:nth-of-type(1) { position: absolute; top: 80px; cursor: pointer; }
        #tiezi > video:nth-of-type(1) { position: absolute; right: 500px; top: 120px; width: 20%; height: 20%; transform: rotate(30deg);
mix-blend-mode: multiply; }
        #tiezi > img:nth-of-type(1) { position: absolute; bottom: 120px;left: 680px; width: 200px; cursor: pointer; user-select: none; transform-origin: 50% 100%; animation: swear linear .25s infinite alternate var(--state); }
.video: { width: 170px; height: 170px; left: 100px; top: 70; border-radius: 50% 50% 50% 50%; cursor: pointer; }


        @keyframes swear { from { transform: skewY(5deg); } to { transform: skewY(-5deg); } }
</style>

<div id="tiezi">
        <audio id="aud" src="https://music.163.com/song/media/outer/url?id=1853503927" autoplay></audio>
        <img id="mypic" src="https://xlaj.cn/assets/file/zp/20240516171526.png" alt="" />
        <video src="https://img.tukuppt.com/video_show/2269348/00/17/44/5ec49820da8aa.mp4" loop muted></video>
        <canvas width="350" height="350"></canvas>
</div>

<script>
        var files = [
                'https://638183.freep.cn/638183/web/js2024/lrc_only.js',
                'https://638183.freep.cn/638183/web/js2024/3dball.js'
        ];
        files.forEach((_, key) => {
                var sF = document.createElement('script');
                sF.charset = 'UTF-8';
                sF.src = files;
                document.body.appendChild(sF);
                sF.onload = () => {
                        if(key === 0) {
                                LRC({
                                        papa: '#tiezi',
                                        lrc_css: 'top: 80px;left: 120px; color: AliceBlue; --bg: linear-gradient(rgba(100,149,237,.2), rgba(100,149,237,.6))',
                                        lrcAr: geci
                                });
                        }
                        else mypic.onclick = () => aud.paused ? aud.play() : aud.pause();
                };
        });

        var lz = {papa: tiezi, total: 350, r: 4, color: '#249f5a'};
        var geci = [['0.02', ' 套用一个黑黑的小池塘',4.35],
['4.50', ' 小和尚',1.43],
['6.77', '出品：子弹工作室',1.95],
['9.82', '抬头看月亮',2.00],
['11.93', '门前烧着一炷香',2.01],
['14.05', '经文放在身旁',2.02],
['16.18', '我的梦还闪着光',2.32],
['18.62', '白胡子老方丈',1.92],
['20.64', '说山下厉鬼游荡',2.22],
['22.98', '我魂牵梦萦不思量',1.92],
['25.00', '你的笑也难忘',2.11],
['27.22', '我的武功秘籍真是强',2.23],
['29.57', '一拳打败老和尚',1.96],
['31.63', '老和尚下山没交代',2.15],
['33.89', '小和尚跑得快',1.80],
['35.79', '我要飞檐走壁穿过墙',2.48],
['38.40', '凌波微步快过光',2.08],
['40.59', '老和尚化缘不化妆',1.93],
['42.62', '小和尚想姑娘',10.58],
['53.76', '白胡子老方丈',1.88],
['55.74', '说山下厉鬼游荡',2.14],
['57.99', '我魂牵梦萦不思量',2.16],
['60.26', '你的笑也难忘',2.17],
['62.54', '佛说功德无量',2.06],
['64.71', '没说我对你的想',2.10],
['66.92', '我辗转反侧心痒痒',2.10],
['69.13', '就人间走一趟',2.04],
['71.28', '我的武功秘籍真是强',2.14],
['73.53', '一拳打败老和尚',2.05],
['75.69', '老和尚下山没交代',2.02],
['77.82', '小和尚跑得快',2.02],
['79.95', '我要飞檐走壁翻过墙',2.39],
['82.47', '凌波微步快过光',2.01],
['84.59', '老和尚化缘不化妆',2.17],
['86.87', '小和尚想姑娘',2.21],
['89.20', '从前有座山',1.86],
['91.16', '住着菩萨和金刚',2.03],
['93.30', '请恕小僧太狂妄',2.02],
['95.43', '有你冷雨微微凉',2.33],
['97.88', '这是谁家的姑娘',1.76],
['99.73', '是我心上白月光',2.19],
['102.03', '既然爱上你模样',2.07],
['104.21', '负了如来又何妨',2.11],
['106.43', '我的武功秘籍真是强',2.27],
['108.82', '一拳打败老和尚',2.13],
['111.06', '老和尚下山没交代',2.13],
['113.30', '小和尚跑得快',1.82],
['115.22', '我要飞檐走壁穿过墙',2.24],
['117.58', '凌波微步快过光',2.07],
['119.76', '老和尚化缘不化妆',2.10],
['121.97', '小和尚想姑娘',2.18],
['124.26', '你的可爱酒窝太难忘',2.01],
['126.38', '一夜春风百花香',2.15],
['128.64', '小和尚下山寻暖阳',2.17],
['130.92', '老和尚叹茶凉',2.02],
['133.05', '我还穿着袈裟却慌张',2.18],
['135.34', '大步流星趁月光',2.01],
['137.46', '小和尚念经不参详',2.16],
['139.73', '只参我的姑娘',2.22],
['142.07', '制作人：君君@子弹',2.01],
['144.19', '编曲：支爽@传齐音乐',2.06],
['146.36', '吉他：支爽',2.02],
['148.49', '混音/母带：丁培峰',2.23],
['150.84', '录音棚：上海鸿星录音棚',2.06],
['153.01', 'OP：子弹工作室',2.23],
['155.36', 'SP：网易知识公路',2.05],
['157.52', '本歌曲来自网易云音乐【子弹工作室】',0.47],
['158.02', '打造直击灵魂的音乐，',0.09],
['158.12', '',4.5]];
</script>

小辣椒 发表于 2024-5-16 20:37

上面那粒子和小和尚是播放器按钮联动控制的

liumang 发表于 2024-5-16 20:38

{:5_150:}{:5_150:}{:5_150:}

liumang 发表于 2024-5-16 20:39

有童趣的制作，小和尚念经{:5_128:}

小辣椒 发表于 2024-5-16 20:41

liumang 发表于 2024-5-16 20:39
有童趣的制作，小和尚念经

liumang晚上好{:5_141:}

無名 发表于 2024-5-17 17:18

可爱的小和尚

小辣椒 发表于 2024-5-19 20:25

無名 发表于 2024-5-17 17:18
可爱的小和尚

问好無名，这个你可以看见？
页: [1]
查看完整版本: 小和尚念经