论坛 › 祝福礼堂 › 最美的祝福送给红影 ：生日快乐！

大猫咪 发表于 2024-1-7 00:25

最美的祝福送给红影 ：生日快乐！

<style>
#papa {
        margin: 120px 0 10px calc(50% - 741px);
        width: 1280px;
        height: 720px;
        background: url('https://pic.imgdb.cn/item/6596d8a4871b83018ad2e3ad.jpg') no-repeat center/cover;
        box-shadow: 3px 3px 20px #000;
        overflow: hidden;
        display: grid;
        place-items: center;
        position: relative;
        z-index: 1;
}
#mypic {
        position: absolute;
        mix-blend-mode: multiply;
        width: 200px;
                left: 550px;top:220px;
        cursor: pointer;
        transition: filter 1s;
        animation: rot 6s infinite linear var(--state);
}
#mypic:hover {
        filter: sepia(50%) drop-shadow(4px 4px 20px snow);
}
li-zi {
        position: absolute;
        width: 50px;
        height: 1px;
        background: linear-gradient(to right,snow,yellow);
        animation: moving var(--du) var(--de) infinite linear var(--state);
}

@keyframes yao {
      from{transform: perspective(800px) rotatex(26deg); }
      to { transform: perspective(800px) rotatex(-26deg); }
}

@keyframes moving {
        from { transform: translate(0,0) rotate(var(--deg)); opacity: 0; }
        to { transform: translate(var(--xx),var(--yy)) rotate(var(--deg)); opacity: 1; }
}
@keyframes rot { to { transform: rotate(360deg); } }
</style>

<div id="papa">
        <img id="mypic" src="https://pic.imgdb.cn/item/6596d644871b83018ac73675.png" alt="" title="暂停/播放" />
        <audio id="aud" src="https://music.163.com/song/media/outer/url?id=29789745" autoplay loop></audio>


<script>

(function() {

let total = 160;
Array.from({length: total}).forEach((lz,key) => {
        lz = document.createElement('li-zi');
        let hudu = Math.PI / 180 * 360 / total * key;
        let xx = 800 * Math.cos(hudu), yy = 800 * Math.sin(hudu);
        lz.style.cssText += `
                --xx: ${xx}px;
                --yy: ${yy}px;
                --deg: ${360 / total * key}deg;
                --du: ${2 + Math.random() * 2}s;
                --de: -${Math.random() * 3}s;
        `;
        papa.prepend(lz);
});
let mState = () => papa.style.setProperty('--state', aud.paused ? 'paused' : 'running');
aud.addEventListener('pause', () => mState());
aud.addEventListener('playing', () => mState());
mypic.onclick = () => aud.paused ? aud.play() : aud.pause();

})();

</script>

大猫咪 发表于 2024-1-7 00:26

红影生日是个好日子，猫送祝福来了，有生的日子快快乐乐，祝福健康快乐！{:4_179:}

红影 发表于 2024-1-7 00:31

呀，猫猫也是凌晨送礼物来了，太开心了。有你们真好{:4_187:}

辫子哥哥 发表于 2024-1-7 00:31

猫咪也在，都是被小辣椒带坏的，快去休息，明天在玩

红影 发表于 2024-1-7 00:34

这个制作好漂亮啊，还是黑黑代码做的呢。有特制按钮，还有飘飞粒子，猫猫厉害{:4_199:}

樵歌 发表于 2024-1-7 08:04

大猫咪正巧赶在点儿上送祝福礼物，有鲜花的馋人的蛋糕，还大放光明呢{:4_173:}

红影 发表于 2024-1-7 09:43

辫子哥哥 发表于 2024-1-7 00:31
猫咪也在，都是被小辣椒带坏的，快去休息，明天在玩

你也被她带坏的吧{:4_173:}

红影 发表于 2024-1-7 09:44

早上再来看，昨天已经躺下了没发开音乐。这个还是多种语言的生日祝福歌呢。谢谢猫猫{:4_187:}

梦油 发表于 2024-1-7 10:09

很荣幸能和猫咪朋友共祝红影生日快乐！

冬天的雨 发表于 2024-1-7 10:45

猫猫不愧名牌大学的高材生，居然用法语的生日快乐歌{:4_177:}

亦是金 发表于 2024-1-7 10:56

和猫猫共祝红影生日快乐！{:4_187:}

庶民 发表于 2024-1-7 10:56

https://www.huachaowang.com/forum.php?mod=attachment&aid=NDUxMjh8Zjc1ZTI0OTl8MTcwNDU5NjEzN3w3NjU2fDczNDQz&noupdate=yes

驻在平安夜前夕 发表于 2024-1-7 12:08

今日才是真正的生日？

驻在平安夜前夕 发表于 2024-1-7 12:08

驻在平安夜前夕 发表于 2024-1-7 12:08
今日才是真正的生日？

过往不是贺早了？

驻在平安夜前夕 发表于 2024-1-7 12:09

那就正式地贺一次{:5_106:}

小九 发表于 2024-1-7 12:53

很漂亮的生日贴，今天是影子正生，同贺影子生日快乐！{:4_187:}{:4_176:}

大猫咪 发表于 2024-1-7 13:28

和楼上兄弟姐妹一起祝福红影生日快乐，快乐无比属于你，健康平安拥抱你！岁岁幸福平安！


https://pic.52112.com/180705/JPG-180705_940/ATVT8hMA0Z_small.jpg

千羽 发表于 2024-1-7 19:55

猫咪在暗中学艺啊，图图做得真漂亮，{:4_199:}

千羽 发表于 2024-1-7 19:56

我们一起祝福影儿生日快乐，好运相伴{:4_187:}

辫子哥哥 发表于 2024-1-7 22:16

红影 发表于 2024-1-7 09:43
你也被她带坏的吧

我现在弯镰打刺刀，改邪归正了{:4_170:}

查看完整版本: 最美的祝福送给红影 ：生日快乐！