论坛 › 欢乐水吧 › 梦驼铃 （学习黑黑老师的世中逢尔雨逢花代码）

梦江南 发表于 2025-9-4 17:47

梦驼铃 （学习黑黑老师的世中逢尔雨逢花代码）

<style>
        @import 'https://638183.freep.cn/638183/web/css/tz01.css';
        #pa { --offsetX: 81px; --bg: url('https://img2.oldkids.cn/upload/2025/09/04/blog_260798238_20250904161626675.gif') no-repeat center/cover; --ma-size: 12%; }
        #ma { left: 75%; top: 50px; background: url('https://638183.freep.cn/638183/web/svg/pl-white.svg') no-repeat center/cover; }
        #btnFs { right: 30px; bottom: 30px; color: lightblue; border-color: currentColor!important; }
        #svg use { opacity: 1; animation: flash 0.5s var(--delay) infinite alternate var(--state); }
        @keyframes flash { to { opacity: 0.5; transform: rotate(360deg); } }
</style>

<div id="pa">
        <audio id="aud" src="https://img2.oldkids.cn/upload/2025/09/04/blog_260798238_20250904172941457.mp3" autoplay loop></audio>
        <video class="pd-vid" src="https://video.699pic.com/videos/46/46/47/b_AXWhKpkbXIrQ1558464647_10s.mp4   " autoplay loop muted></video>
        <div id="ma" class="brightness"></div>
        <svg id="svg" width="100%" height="100%" viewBox="0 0 1600 900">
                <defs>
                        <g id="svgShape">
                                <image x="0" y="0" width="30" height="30" href="https://638183.freep.cn/638183/web/svg/pl-white.svg" />
                        </g>
                        <path id="motionPath" d="M400 0 L600 1000" />
                </defs>
        </svg>
</div>

<script type="module">
        import { FS } from 'https://638183.freep.cn/638183/web/js/svglz_fs.js';
        var setting = {        svg: svg, lz: 20, dur: 12, gap: 600 };
        FS(pa, ma, setting);
</script>

杨帆 发表于 2025-9-4 18:33

漂亮！谢谢江南精彩分享{:4_204:}

梦江南 发表于 2025-9-4 18:52

杨帆 发表于 2025-9-4 18:33
漂亮！谢谢江南精彩分享

问好杨帆，谢谢沙发欣赏。{:5_161:}

红影 发表于 2025-9-4 19:43

原来这行走的骆驼是动图，还以为是视频呢。暂停发现它不能停才知道的{:4_173:}

红影 发表于 2025-9-4 19:44

这样的背景和歌曲的意境十分相符。制作漂亮。
欣赏江南好帖{:4_199:}

梦油 发表于 2025-9-4 20:14

行走的骆驼在画面中起到了很重要的作用，可见，江南对此设计得极好。

梦江南 发表于 2025-9-5 07:33

红影 发表于 2025-9-4 19:43
原来这行走的骆驼是动图，还以为是视频呢。暂停发现它不能停才知道的

哈哈，其实也可以以MP4来暂停的。下次应该怎样做了。{:4_204:}

梦江南 发表于 2025-9-5 07:34

红影 发表于 2025-9-4 19:44
这样的背景和歌曲的意境十分相符。制作漂亮。
欣赏江南好帖

谢谢影子欣赏。周末快乐。{:4_187:}

梦江南 发表于 2025-9-5 07:35

梦油 发表于 2025-9-4 20:14
行走的骆驼在画面中起到了很重要的作用，可见，江南对此设计得极好。
谢谢梦油欣赏，谢谢高评。{:4_204:}

梦油 发表于 2025-9-5 11:17

梦江南 发表于 2025-9-5 07:35
谢谢梦油欣赏，谢谢高评。

不客气。

梦江南 发表于 2025-9-5 11:38

梦油 发表于 2025-9-5 11:17
不客气。

谢谢互动。

小辣椒 发表于 2025-9-5 14:37

阿姨这个背景动图做的好，整体效果棒棒的{:4_199:}

梦江南 发表于 2025-9-5 15:24

小辣椒 发表于 2025-9-5 14:37
阿姨这个背景动图做的好，整体效果棒棒的

谢谢小辣椒认可。很开心。{:4_183:}

红影 发表于 2025-9-6 14:24

梦江南 发表于 2025-9-5 07:33
哈哈，其实也可以以MP4来暂停的。下次应该怎样做了。

是啊，视频暂停比动图方便{:4_187:}

红影 发表于 2025-9-6 14:25

梦江南 发表于 2025-9-5 07:34
谢谢影子欣赏。周末快乐。

不客气，问好江南{:4_187:}

梦江南 发表于 2025-9-6 17:25

红影 发表于 2025-9-6 14:24
是啊，视频暂停比动图方便

下次试试。

梦江南 发表于 2025-9-6 17:26

红影 发表于 2025-9-6 14:25
不客气，问好江南

今天是周六了。

红影 发表于 2025-9-6 19:27

梦江南 发表于 2025-9-6 17:25
下次试试。

可以单独加个人物图在前面，这样骆驼还可以走到人物背后去。

红影 发表于 2025-9-6 19:27

梦江南 发表于 2025-9-6 17:26
今天是周六了。

一周周的时间很快{:4_204:}

梦江南 发表于 2025-9-7 09:20

红影 发表于 2025-9-6 19:27
可以单独加个人物图在前面，这样骆驼还可以走到人物背后去。

这样的话要扣图了。

查看完整版本: 梦驼铃 （学习黑黑老师的世中逢尔雨逢花代码）