执著 发表于 2024-5-13 23:31

临摹马导“孤行者”- 繁花

<style>
    #papa { margin: 20px 0 20px calc(50% - 593px); width: 1024px; height: 576px; background: url('https://pic.imgdb.cn/item/6640e27d0ea9cb1403ade195.webp') no-repeat center/cover; box-shadow: 3px 3px 6px gray; overflow: hidden; z-index: 1; position: relative; }
    #canv3d { display: block; position: absolute; left: 150px; }
    #player { position: absolute; left: 30px; top: 30px; width: 200px; height: 200px; object-fit: cover; border-radius: 50%; cursor: pointer; filter: drop-shadow(3px 3px 12px pink); z-index: 9; }
    .vid { position: absolute; bottom: 0; width: 100%; height: calc(100% + 60px); object-fit: cover; mix-blend-mode: multiply; }
    #pic{
                                position: absolute;
                                right: 20px;
                                top: -5px;
                                width: 170px;
                                height: 200px;
                               }

</style>

<div id="papa">
    <audio id="aud" src="https://cccimg.com/view.php/775251174f9f7fac6f4108c18544dc69.mp3" autoplay loop></audio>
    <video id="player" src="https://od.lk/s/NzBfMTY3OTI4MTlf/%E9%85%B7%E7%82%AB%E9%9C%93%E8%99%B9%E7%81%AF%E9%9A%A7%E9%81%93LED.mp4" disablePictureInPicture autoplay loop muted></video>
   <img id="pic" src="https://od.lk/s/NzBfMTY5ODc5OTNf/133.gif" alt="" />
   
    <canvas width="600" height="576" id="canv3d"></canvas>
</div>

<script>

let sFile = document.createElement('script');
sFile.src = 'https://638183.freep.cn/638183/web/api/lrc.js';
sFile.charset = 'utf-8';
document.head.appendChild(sFile);

sFile.onload = () => {
        LRC({
papa: '#papa',
                lrcAr: geci,
                btn: '#papa',
                lrc_css: 'left: 50%; transform: translate(-50%); bottom: 10px;',
        });
};

let geci = [
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];      
var sF = document.createElement('script');
    sF.src = 'https://638183.freep.cn/638183/web/js/cloth3d.js';
    document.body.appendChild(sF);
aud.onplaying = aud.onpause = () => aud.paused ? player.pause() : player.play();
    player.onclick = () => aud.paused ? aud.play() : aud.pause();
    player.oncontextmenu = (e) => e.preventDefault();


</script>



红影 发表于 2024-5-13 23:53

很漂亮的制作，构思很棒。欣赏执著好帖{:4_204:}

红影 发表于 2024-5-13 23:55

这个没看到播放器按钮呢{:4_203:}

愤怒的葡萄 发表于 2024-5-14 05:29

非常漂亮音画作品。

起个网名好难 发表于 2024-5-14 05:53

https://s3.bmp.ovh/imgs/2023/05/24/d90e46c0779fdc6b.gif

执著 发表于 2024-5-14 16:17

红影 发表于 2024-5-13 23:53
很漂亮的制作，构思很棒。欣赏执著好帖

谢谢老师谬赞，搞了两天才这样！没找到合适的mp4，只好加了个gif

执著 发表于 2024-5-14 16:18

红影 发表于 2024-5-13 23:55
这个没看到播放器按钮呢

老师看到播放器了吗？可能加载慢

执著 发表于 2024-5-14 16:19

愤怒的葡萄 发表于 2024-5-14 05:29
非常漂亮音画作品。

谢谢老师鼓励哈{:4_204:}

执著 发表于 2024-5-14 16:19

起个网名好难 发表于 2024-5-14 05:53


谢谢老师捧场鼓励{:4_191:}

红影 发表于 2024-5-14 21:17

执著 发表于 2024-5-14 16:17
谢谢老师谬赞，搞了两天才这样！没找到合适的mp4，只好加了个gif

制作很漂亮呢{:4_187:}

红影 发表于 2024-5-14 21:17

执著 发表于 2024-5-14 16:18
老师看到播放器了吗？可能加载慢

还是看不到，不知道怎么回事。

执著 发表于 2024-5-14 21:37

红影 发表于 2024-5-14 21:17
还是看不到，不知道怎么回事。

啊！匪夷所思！对了，这里不能发截图？

红影 发表于 2024-5-14 22:06

执著 发表于 2024-5-14 21:37
啊！匪夷所思！对了，这里不能发截图？

估计图片太大吧。播放器视频我看帖子里的地址看到了，但是帖子里看不到，估计我网速的问题吧。
页: [1]
查看完整版本: 临摹马导“孤行者”- 繁花