论坛 › 欢乐水吧 › 《做自己的光》TO 大猫咪

红影 发表于 2022-5-4 11:50

《做自己的光》TO 大猫咪

<style>
.hy { width: 900px; height: 500px; position: relative;left:-52px; top: 120px;box-shadow:4px 4px 5px #333; padding:2px;border-radius:8px;background:#666 url('https://pic.imgdb.cn/item/627141880947543129264f53.jpg')no-repeat center/cover;}
.hy::before {
      content: '';
      position: absolute;
      width: 230px;
      height: 230px;
      background: url('https://pic.imgdb.cn/item/62708398239250f7c5d0e29d.gif') no-repeat center/cover;
      border-radius: 50%;
      left:450px; top: 80px;opacity: .95;
}

.mama {
        top: 50px;left:540px;
        width: 80px;
        height: 80px;
        position: absolute;

      
}
.flower {
        width: 48px;
        height: 56px;
        left: 30%;
        border-radius: 0 100%;
        transform-origin: 0 240%;
        position: absolute;
}

</style>
<div class="hy">
   <div class="mama"></div>
       <div style="position: absolute; left:60px; top: 180px; width:260px;">
                <img alt="" src="https://pic.imgdb.cn/item/627143c909475431292e013a.gif"/>         
       </div>
</div><br><br><br><br><br><br><br><br><br><br>

<script>

let mama = document.querySelector('.mama');
chgc();
let cc = setInterval(chgc, 1000);
function chgc(){
let str = '';
for(j=0; j< 24; j++) {
        let c1 = `#${Math.random().toString(16).substr(-6)}`;
        let c2 = `#${Math.random().toString(16).substr(-6)}`;
        str += `<div class='flower' style='background-image: linear-gradient(${c1}, ${c2}); transform: rotate(${15*j}deg);'></div>`;
}
mama.innerHTML = str;}

let flag = true;
let au = document.createElement("audio");
au.src= "http://music.163.com/song/media/outer/url?id=1885938515.mp3";
au.loop = true;
au.autoplay = flag;
au.style.display = "none";
ele.appendChild(au);
if(!flag) ele.style.animationPlayState = "paused";
ele.onclick = function(){
      flag ? (au.pause(),this.style.animationPlayState = "paused",flag = false) : (au.play(),this.style.animationPlayState = "running",flag = true);
}
</script>

红影 发表于 2022-5-4 11:51

祝猫猫五四青年节快乐，恭喜考试完成{:4_187:}

红影 发表于 2022-5-4 11:52

借用一下东篱大哥做的一个动图，赶紧把上次做的一个花环用上{:4_173:}

加林森 发表于 2022-5-4 11:57

红影制作得真漂亮，很有创意。{:4_204:}猫猫收礼开森！{:4_171:}

大猫咪 发表于 2022-5-4 12:14

红影制作得棒，{:4_187:}很有创意 {:4_190:}猫头像还会动，{:5_106:}

做自己的光，照亮前进的方向，向着美好的未来前进！{:5_106:}

谢谢红影，{:4_179:}借美帖同祝大家节日快乐！

{:4_204:}{:4_199:}

大猫咪 发表于 2022-5-4 12:16

加林森 发表于 2022-5-4 11:57
红影制作得真漂亮，很有创意。猫猫收礼开森！

谢谢队长，中午好 {:4_179:}{:4_187:} 节日快乐 {:4_191:}

加林森 发表于 2022-5-4 12:17

大猫咪 发表于 2022-5-4 12:16
谢谢队长，中午好节日快乐

猫猫上来啦，中午好!节日快乐！{:4_204:}{:4_191:}{:4_179:}

大猫咪 发表于 2022-5-4 12:19

红影 发表于 2022-5-4 11:51
祝猫猫五四青年节快乐，恭喜考试完成

谢谢红影 {:4_187:}结果出来了， 第11名，成功通过   {:5_117:}{:4_190:}估计是一生最后一次考试了

{:5_106:}

大猫咪 发表于 2022-5-4 12:20

加林森 发表于 2022-5-4 12:17
猫猫上来啦，中午好!节日快乐！

刚回来队长 ，谢谢 {:4_179:} 一起快乐，{:4_204:}{:4_191:}

加林森 发表于 2022-5-4 12:29

大猫咪 发表于 2022-5-4 12:20
刚回来队长 ，谢谢一起快乐，

好的，回来就好好休息一下。{:4_179:}{:4_204:}{:4_191:}

大猫咪 发表于 2022-5-4 12:30

加林森 发表于 2022-5-4 12:29
好的，回来就好好休息一下。

嗯嗯{:4_179:}谢谢队长{:4_190:}

加林森 发表于 2022-5-4 12:32

大猫咪 发表于 2022-5-4 12:30
嗯嗯    谢谢队长

不客气的。恭喜你过关了。{:4_179:}{:4_190:}

大猫咪 发表于 2022-5-4 12:34

加林森 发表于 2022-5-4 12:32
不客气的。恭喜你过关了。

{:4_179:}{:4_190:}{:4_191:}

加林森 发表于 2022-5-4 12:42

大猫咪 发表于 2022-5-4 12:34


{:4_179:}{:4_204:}{:4_191:}

红影 发表于 2022-5-5 09:40

加林森 发表于 2022-5-4 11:57
红影制作得真漂亮，很有创意。猫猫收礼开森！

这个节日祝福猫猫正好，顺便把变色花环用上了{:4_173:}

红影 发表于 2022-5-5 09:41

大猫咪 发表于 2022-5-4 12:14
红影制作得棒，很有创意 猫头像还会动，

做自己的光，照亮前进的方向，向 ...

这个动态是上次东篱大哥做的，我借来一用{:4_173:}

红影 发表于 2022-5-5 09:42

大猫咪 发表于 2022-5-4 12:19
谢谢红影 结果出来了， 第11名，成功通过   估计是一生最后一次考试了

...

猫猫好厉害，不但通过了，成绩还那么好。{:4_187:}
你还年轻呢，后面需要奋发努力的地方多着呢{:4_173:}

加林森 发表于 2022-5-5 09:52

红影 发表于 2022-5-5 09:40
这个节日祝福猫猫正好，顺便把变色花环用上了

挺好的，漂亮！

红影 发表于 2022-5-5 12:14

加林森 发表于 2022-5-5 09:52
挺好的，漂亮！

还行，算是比较热闹的帖子{:4_173:}

加林森 发表于 2022-5-5 12:30

红影 发表于 2022-5-5 12:14
还行，算是比较热闹的帖子

是的是的。

查看完整版本: 《做自己的光》TO 大猫咪