花飞飞 发表于 2023-8-3 20:14

胡杨【TO:千羽】(学习黑师《罗刹海市》小圆播封装歌词效果)

本帖最后由 花飞飞 于 2023-8-10 17:20 编辑 <br /><br /><style>#mydiv { margin: 0 0 0 calc(50% - 720px); width: 1300px; height: 700px; background: url('https://s1.ax1x.com/2023/08/03/pPih5uT.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; display: grid; place-items: center; position: relative; overflow: hidden;}
#vid {
        position: absolute;
        width: 120%;
        height: 110%;
        top:-10px;

        object-fit: cover;
        pointer-events: none;
        mix-blend-mode: screen;
        z-index: 2;
        opacity: .25;
}</style><div id="mydiv"><video id="vid" src="https://img.tukuppt.com/video_show/2629112/00/02/03/5b4f2ae929323.mp4" autoplay="" loop="" muted=""></video></div><audio id="aud" src="https://music.163.com/song/media/outer/url?id=77324" autoplay="" loop=""></audio>

    <script>

    (function() {
      let script = document.createElement('script');
      script.src = 'https://638183.freep.cn/638183/web/api/circle_lrc.js';
      document.head.appendChild(script);
      let lrcAr = [ , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ];
      window.onload = () => {
            HCPlayer({
                papa: '#mydiv',
                lrcAr: lrcAr,
                lrc_css: 'bottom: 10px;font: bold 30px/38px sans-serif;color: Azure; --bg:         PaleTurquoise;',
                player_css: 'right: 50px; bottom: 10px;',
            });
      }
    })();

    setInterval( () => { aud.paused ? vid.pause() : vid.play(); },100);

    </script>

花飞飞 发表于 2023-8-3 20:17

@千羽 练了几天图,挑张比较满意的送给亲爱的羽宝~~谢谢你一直关注我的学习进度,一直无条件的帮我~~{:4_183:}

花飞飞 发表于 2023-8-3 20:29

@马黑黑 它又咋了?你过了目才发的。。。{:4_198:}

红影 发表于 2023-8-3 20:52

好漂亮的画面,歌曲也极有特色。飞飞好美的制作{:4_199:}

红影 发表于 2023-8-3 20:53

没看到歌词和播放器啊{:4_203:}

马黑黑 发表于 2023-8-3 20:59

花飞飞 发表于 2023-8-3 20:29
@马黑黑 它又咋了?你过了目才发的。。。

论坛和自由网站发帖环境不尽一致。你这里,根本就没有导入插件,这是问题一,问题二是,要通过 window.onload 加载插件,论坛的帖子才能正常运行。JS部分代码应调整如下:

<script>

(function() {
    let script = document.createElement('script');
    script.src = 'https://638183.freep.cn/638183/web/api/circle_lrc.js';
    document.head.appendChild(script);
    let lrcAr = [ , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ];
    window.onload = () => {
      HCPlayer({
            papa: '#mydiv',
            lrcAr: lrcAr,
            lrc_css: 'bottom: 10px;font: bold 30px/38px sans-serif;color: Azure; --bg:         PaleTurquoise;',
            player_css: 'right: 50px; bottom: 10px;',
      });
    }
})();

setInterval( () => { aud.paused ? vid.pause() : vid.play(); },100);

</script>

花飞飞 发表于 2023-8-3 21:02

红影 发表于 2023-8-3 20:52
好漂亮的画面,歌曲也极有特色。飞飞好美的制作

谢谢影子,瞧我这一个贴子整得一头汗。。{:4_170:}

花飞飞 发表于 2023-8-3 21:06

马黑黑 发表于 2023-8-3 20:59
论坛和自由网站发帖环境不尽一致。你这里,根本就没有导入插件,这是问题一,问题二是,要通过 window.on ...

{:4_170:}我真是昏头了……之前知道发论坛和网站有不同的,这次却给忘了。。。。

花飞飞 发表于 2023-8-3 21:07

马黑黑 发表于 2023-8-3 20:59
论坛和自由网站发帖环境不尽一致。你这里,根本就没有导入插件,这是问题一,问题二是,要通过 window.on ...

估计手忙脚乱还得一阵子{:4_173:}

花飞飞 发表于 2023-8-3 21:07

红影 发表于 2023-8-3 20:53
没看到歌词和播放器啊

翻车了……论坛和网站代码不太一样。。{:4_173:}

马黑黑 发表于 2023-8-3 21:08

花飞飞 发表于 2023-8-3 21:07
估计手忙脚乱还得一阵子

替换上JS就行了

马黑黑 发表于 2023-8-3 21:08

花飞飞 发表于 2023-8-3 21:06
我真是昏头了……之前知道发论坛和网站有不同的,这次却给忘了。。。。

这叫顾此失彼

红影 发表于 2023-8-3 21:11

花飞飞 发表于 2023-8-3 21:02
谢谢影子,瞧我这一个贴子整得一头汗。。

没事啊,不急的,慢慢来{:4_184:}

红影 发表于 2023-8-3 21:11

花飞飞 发表于 2023-8-3 21:07
翻车了……论坛和网站代码不太一样。。

看到飞飞改好了,真漂亮{:4_199:}

花飞飞 发表于 2023-8-3 21:21

马黑黑 发表于 2023-8-3 21:08
替换上JS就行了

各种问题层出不穷。。。还是得先试贴。。。{:4_173:}

马黑黑 发表于 2023-8-3 21:22

花飞飞 发表于 2023-8-3 21:21
各种问题层出不穷。。。还是得先试贴。。。

试试就试试

花飞飞 发表于 2023-8-3 21:22

马黑黑 发表于 2023-8-3 21:08
这叫顾此失彼

{:4_181:}我就是顾此失彼。。手忙脚乱……五体投地。。

马黑黑 发表于 2023-8-3 21:23

花飞飞 发表于 2023-8-3 21:22
我就是顾此失彼。。手忙脚乱……五体投地。。

{:4_172:}

花飞飞 发表于 2023-8-3 21:23

红影 发表于 2023-8-3 21:11
没事啊,不急的,慢慢来

{:4_183:}好哒,影子最好了

花飞飞 发表于 2023-8-3 21:23

红影 发表于 2023-8-3 21:11
看到飞飞改好了,真漂亮

{:4_170:}真是好不容易。。。
页: [1] 2 3 4 5
查看完整版本: 胡杨【TO:千羽】(学习黑师《罗刹海市》小圆播封装歌词效果)