绿叶清舟 发表于 2024-4-5 19:45

飞走了


<style>
#papa {
    margin: 20px 0 0 calc(50% - 633px);
    width: 1100px;
    height: 700px;
    background: url('https://p.upyun.com/demo/tmp/Kf1ryLfP.webp') no-repeat center/cover;
    box-shadow: 3px 3px 20px #000;
    position: relative;
    z-index: 1000;
}
#btnplay {
    position: absolute;
    left: -10px;
    top: -10px;
    width: 150px;
    height: 150px;
    transition: 5s;
    cursor: pointer;
    opacity: 1;
    animation: rot 6s linear infinite var(--state);
mix-blend-mode: exclusion;
}
#papa:fullscreen #btnplay { width: 100px; height: 100px; }
#papa video {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 0 50%;
    object-fit: cover;
    opacity: .2;
    pointer-events: none;

}
@keyframes rot { to { transform: rotate(180deg); } }

</style>

<div id="papa">
    <audio src="https://music.163.com/song/media/outer/url?id=247810" autoplay loop></audio>
    <div class="rain"></div>
      <div class="circle"></div>
    <img id="btnplay" src="https://p.upyun.com/demo/tmp/p3gps6bM.webp" alt="" title="点击播放" />
</div>

<script>
(function() {
    let sF = document.createElement('script');
    sF.src = 'https://638183.freep.cn/638183/web/api/fsgo_hc.js';
    sF.charset = 'utf-8';
    document.querySelector('body').appendChild(sF);
    sF.onload = () => FS({
      papa: '#papa',
      css: '--bg: transparent; --color: #ccc; bottom: 10px; left: 48%;',
      go: {x: true, y: true}
    });
})();

</script>

樵歌 发表于 2024-4-5 20:05

太科幻，太奇特，外星音乐。震憾人心。

红影 发表于 2024-4-5 20:12

很奇特的制作，那个按钮在不同的背景下颜色也是变化的呢{:4_199:}

红影 发表于 2024-4-5 20:14

这个按钮的样子也很像“飞”字呢，在屏幕上也是随着鼠标飞行的呢。爱的天使飞走了。
清舟的制作构思很奇妙，很赞{:4_199:}

红影 发表于 2024-4-5 20:15

这首歌还是头一次听呢，好听{:4_187:}

梦油 发表于 2024-4-5 20:33

这只鸟可以跟着鼠标飞。

马黑黑 发表于 2024-4-5 21:26

飞走的方式还挺特别

绿叶清舟 发表于 2024-4-5 21:30

樵歌 发表于 2024-4-5 20:05
太科幻，太奇特，外星音乐。震憾人心。

外星人也说中文的啊{:4_189:}

绿叶清舟 发表于 2024-4-5 21:30

马黑黑 发表于 2024-4-5 21:26
飞走的方式还挺特别

本来想不让转的，可是直飞感觉效果又不好

绿叶清舟 发表于 2024-4-5 21:31

梦油 发表于 2024-4-5 20:33
这只鸟可以跟着鼠标飞。

还是飞不出手掌心啊{:4_189:}

绿叶清舟 发表于 2024-4-5 21:31

红影 发表于 2024-4-5 20:12
很奇特的制作，那个按钮在不同的背景下颜色也是变化的呢

谢谢影，那是因为滤镜了

小辣椒 发表于 2024-4-5 22:09

清舟这个效果漂亮，会动脑子的清舟，名称看见你的东西都有惊喜{:4_199:}

小辣椒 发表于 2024-4-5 22:10

这个滤镜用力小鸟更加活灵活现了

小辣椒 发表于 2024-4-5 22:10

欣赏清舟精彩的效果{:4_199:}

红影 发表于 2024-4-5 23:04

绿叶清舟 发表于 2024-4-5 21:31
谢谢影，那是因为滤镜了

是的，清舟把这功能用得很好呢{:4_187:}

樵歌 发表于 2024-4-6 07:16

绿叶清舟 发表于 2024-4-5 21:30
外星人也说中文的啊

入乡随俗呗{:4_189:}

南无月 发表于 2024-4-6 09:20

飞得有特色，字设计的好，创意好，实现手法也好。。
非常精彩。。{:4_199:}

梦油 发表于 2024-4-6 14:03

绿叶清舟 发表于 2024-4-5 21:31
还是飞不出手掌心啊

一切尽在清舟掌握之中。

绿叶清舟 发表于 2024-4-6 19:34

红影 发表于 2024-4-5 23:04
是的，清舟把这功能用得很好呢

凑巧了{:4_189:}

绿叶清舟 发表于 2024-4-6 19:34

梦油 发表于 2024-4-6 14:03
一切尽在清舟掌握之中。

俺有这么厉害啊
页: [1] 2
查看完整版本: 飞走了