马黑黑 发表于 2022-4-4 13:33

祝小辣椒早日康复

本帖最后由 马黑黑 于 2022-4-4 13:44 编辑 <br /><br /><style>

.outer {
        position: relative;
        width: 1300px;
        height: 739px;
        left: -352px;
        background: url('https://638183.freep.cn/638183/Pic/2022/birds.gif') left bottom repeat-x,url('https://638183.freep.cn/638183/Pic/2022/h03.png') no-repeat center/cover;
        opacity: .95;
}
.outer::before {
        content: '祝小辣椒早日康复';
        position: absolute;
        display: inline-block;
        font: bold 2em / 2em Sans-serif;
        color: #184570;
        text-shadow: 2px 2px 4px #333;
        left: 100px;
        top: 20px;
        animation: fly linear 10s infinite alternate;
}
.ball {
        position: absolute;
        left: 750px;
        top: 302px;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        cursor: pointer;
}

.ball::before {
        content: '';
        position: absolute;
        width: 30px;
        height: 30px;
        background: pink;
        border-radius: 50%;
        left: 0;
        top: -100px;
        opacity: .2;
        animation: flash 5s linear infinite alternate;
}
@keyframes flash { to { opacity: 0; } }
@keyframes fly { to { left: 950px; } }

</style>

<div class="outer">
        <div class="ball"></div>
</div>

<script language="javascript">

var flag = true;
var bb = document.querySelector('.ball');
var aud = document.createElement('audio');
aud.src = 'http://www.kumeiwp.com/sub/filestores/2022/02/13/c12e930bef74166964f9f0585f069599.mp3';
aud.loop = true;
aud.autoplay = true;
document.querySelector('.outer').appendChild(aud);

var TT = setInterval(wobian, 200);

bb.onclick = function() {
        if(flag) {
                aud.pause();
                clearInterval(TT);
                flag = false;
        } else {
                aud.play();
                TT = setInterval(wobian, 200);
                flag = true;
        }
}

function wobian() {
        let c1 = `#${Math.random().toString(16).substr(-6)}`;
        let c2 = `#${Math.random().toString(16).substr(-6)}`;
        bb.style.background = `linear-gradient(120deg, ${c1} 0%, ${c2} 100%)`;
}

</script>

马黑黑 发表于 2022-4-4 13:39

@小辣椒 身体恢复后要跟马黑爷爷锻炼身体哈

加林森 发表于 2022-4-4 13:41

让我们共同祝福小辣椒早日康复!{:4_171:}

马黑黑 发表于 2022-4-4 13:42

加林森 发表于 2022-4-4 13:41
让我们共同祝福小辣椒早日康复!

{:5_108:}

加林森 发表于 2022-4-4 13:43

马黑黑 发表于 2022-4-4 13:42


{:5_108:}

安宁 发表于 2022-4-4 13:55

此祝,将军已令人八百里加急送达小辣椒签收。
小辣椒即将闪亮登场致谢大家的祝福。
共盼。

马黑黑 发表于 2022-4-4 13:59

安宁 发表于 2022-4-4 13:55
此祝,将军已令人八百里加急送达小辣椒签收。
小辣椒即将闪亮登场致谢大家的祝福。
共盼。

物流艰难,还望将军给个特权{:5_106:}

安宁 发表于 2022-4-4 14:14

马黑黑 发表于 2022-4-4 13:59
物流艰难,还望将军给个特权

共克时艰

马黑黑 发表于 2022-4-4 14:16

安宁 发表于 2022-4-4 14:14
共克时艰

{:5_108:}

大猫咪 发表于 2022-4-4 14:26

老黑这制作真棒,赞!

一起祝福小辣椒早日康复!

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

马黑黑 发表于 2022-4-4 14:34

大猫咪 发表于 2022-4-4 14:26
老黑这制作真棒,赞!

一起祝福小辣椒早日康复!

{:4_180:}

四海八荒 发表于 2022-4-4 17:45

同祝福

马黑黑 发表于 2022-4-4 18:30

四海八荒 发表于 2022-4-4 17:45
同祝福

喝茶
{:4_190:}

小辣椒 发表于 2022-4-4 19:02

马黑黑 发表于 2022-4-4 13:39
@小辣椒 身体恢复后要跟马黑爷爷锻炼身体哈

谢谢 黑黑~~~{:4_173:}

小辣椒 发表于 2022-4-4 19:02

加林森 发表于 2022-4-4 13:41
让我们共同祝福小辣椒早日康复!

谢谢队长{:4_187:}

小辣椒 发表于 2022-4-4 19:03

安宁 发表于 2022-4-4 13:55
此祝,将军已令人八百里加急送达小辣椒签收。
小辣椒即将闪亮登场致谢大家的祝福。
共盼。

谢谢安宁{:4_171:}

小辣椒 发表于 2022-4-4 19:03

大猫咪 发表于 2022-4-4 14:26
老黑这制作真棒,赞!

一起祝福小辣椒早日康复!

谢谢猫猫{:4_187:}

小辣椒 发表于 2022-4-4 19:04

四海八荒 发表于 2022-4-4 17:45
同祝福

谢谢八荒{:4_187:}

小辣椒 发表于 2022-4-4 19:06

谢谢黑黑的精美礼物,制作非常的漂亮,可惜小辣椒这么久没有学习新教程了

马黑黑 发表于 2022-4-4 19:06

小辣椒 发表于 2022-4-4 19:02
谢谢 黑黑~~~

一言为定
页: [1] 2
查看完整版本: 祝小辣椒早日康复