论坛 › 祝福礼堂 › 新年祝福 花潮新老朋友新年快乐

樵歌 发表于 2023-12-31 08:48

新年祝福 花潮新老朋友新年快乐

<style>
#papa { left: -214px; width: 1024px; height: 600px; background: gray url('https://pic.imgdb.cn/item/6590bc16c458853aef268ddb.jpg') no-repeat center/cover; box-shadow: 4px 4px 24px #000; position: relative; }
#mama { position: absolute; left: 100px; top: calc(50% - 180px); display: grid; place-items: center; width: 360px; height: 360px; cursor: pointer; }
#tit { position: absolute; left: 26px; top: 26px; font: bold 26px / 26px sans-serif; color: lightblue; text-shadow: 1px 1px 2px rgba(0,0,0,.8); }
.txt { position: absolute; width: 60px; height: 60px; font: bold 40px / 60px sans-serif; text-align: center; text-shadow: 2px 2px 4px rgba(0,0,0,.7); border-radius: 50%; color: snow; }
</style>

<div id="papa">
        <span id="tit">樵歌 - 《轱辘回文•贺新年》</span>
        <div id="mama"><span id="sMsg" class="txt">1</span></div>
</div>

<script>
let idx = 0, step = 0;
let strAr = '乐论坛音画字贺新年祝酒成欢'.split(''), spans = [],
        sentences = [
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
                ,
        ];
let aud = new Audio();
aud.src = 'https://music.163.com/song/media/outer/url?id=395313.mp3';
aud.loop = true;
aud.autoplay = true;

let num = (min, max) => Math.floor(Math.random() * (max-min+1)) + min;

for(let x in strAr) {
        let ele = document.createElement('span');
        ele.className = 'txt';
        ele.innerText = strAr;
        ele.style.transform = `rotate(${x*27.6}deg) translateY(180px) rotate(${-x*27.6}deg)`;
        mama.appendChild(ele);
        spans.push(ele);
}

txtColor()
txtCircle();

mama.onclick = () => aud.paused ? aud.play() : aud.pause();

function txtColor() {
        for(let y of spans) {
                y.style.color = 'snow';
                y.style.border = 'none';
        }
        for(let x of sentences) spans.style.color = `rgb(${num(0,255)},${num(0,255)},${num(0,255)})`;
        sMsg.innerText = idx + 1;
}

function txtCircle() {
        let x = sentences;
        spans.style.border = '1px solid purple';
        step ++;
        if(step > sentences.length - 1) {
                step = 0;
                idx ++;
                if(idx > sentences.length - 1) idx = 0;
                txtColor();
        }
        setTimeout(txtCircle, 1500);
}
</script>

樵歌 发表于 2023-12-31 09:07

三言：祝，酒成欢，乐论坛，音画字，贺新年。四言：祝酒成欢，欢乐论坛。坛音画字，词贺新年。五绝：年祝酒成欢，志欢乐论坛。论坛音画字，画词贺新年。七绝：贺新年祝酒成欢，祝酒成欢乐论坛。欢乐论坛音画字，坛音画字贺新年。

樵歌 发表于 2023-12-31 09:11

敬祝花潮新老朋友们新年快乐！{:4_176:}

梦油 发表于 2023-12-31 09:22

本帖最后由 梦油 于 2023-12-31 09:26 编辑


         谢谢花潮论坛，谢谢樵歌管理员。
         祝樵歌管理员新年快乐、万事遂心！
      借樵歌管理员美帖祝福花潮朋友们新年快乐！

红影 发表于 2023-12-31 13:41

师兄还特地做了轱辘诗来贺新年。这个特别好{:4_199:}

红影 发表于 2023-12-31 13:42

不但有轱辘诗，还有音画加持，这个太赞了{:4_199:}

红影 发表于 2023-12-31 13:43

借师兄好帖同祝大家新年快乐。也祝师兄新年快乐，万事如意。{:4_177:}

醉美水芙蓉 发表于 2023-12-31 20:20

樵歌 发表于 2024-1-1 11:03

梦油 发表于 2023-12-31 09:22
谢谢花潮论坛，谢谢樵歌管理员。
         祝樵歌管理员新年快乐、万事遂心！
      借樵歌管 ...

谢谢老哥的祝福！同祝您新年快乐！

樵歌 发表于 2024-1-1 11:04

红影 发表于 2023-12-31 13:41
师兄还特地做了轱辘诗来贺新年。这个特别好

师兄就只会轱辘，为了找你难我没有鸟儿飞的代码，可是把帖子翻了个底朝天呢{:4_189:}

樵歌 发表于 2024-1-1 11:08

红影 发表于 2023-12-31 13:43
借师兄好帖同祝大家新年快乐。也祝师兄新年快乐，万事如意。

同祝福师妹新年快乐！天天开心！家庭和睦！事业大成！岁月如歌！

樵歌 发表于 2024-1-1 11:08

醉美水芙蓉 发表于 2023-12-31 20:20
樵歌好文采！祝元旦快乐！

同祝水芙蓉新年快乐！天天开心！

红影 发表于 2024-1-1 13:53

樵歌 发表于 2024-1-1 11:04
师兄就只会轱辘，为了找你难我没有鸟儿飞的代码，可是把帖子翻了个底朝天呢

那个很简单啊，只要去掉鸟儿的图片，也一样没有了呢{:4_173:}

红影 发表于 2024-1-1 13:54

樵歌 发表于 2024-1-1 11:08
同祝福师妹新年快乐！天天开心！家庭和睦！事业大成！岁月如歌！

谢谢师兄的美好祝福，太开心了{:4_177:}

冬天的雨 发表于 2024-1-1 14:00

老首长你太强悍了，冬雨佩服极了{:4_178:}

冬天的雨 发表于 2024-1-1 14:02

喜气洋洋的元旦贺帖，又见大侠的轱辘诗，不赞都不行{:4_178:}

冬天的雨 发表于 2024-1-1 14:03

跟祝跟祝 {:4_199:}
三言：祝，酒成欢，乐论坛，音画字，贺新年。
四言：祝酒成欢，欢乐论坛。坛音画字，词贺新年。
五绝：年祝酒成欢，志欢乐论坛。论坛音画字，画词贺新年。
七绝：贺新年祝酒成欢，祝酒成欢乐论坛。欢乐论坛音画字，坛音画字贺新年。

冬天的雨 发表于 2024-1-1 14:05

也祝老首长元旦快乐，新年快乐！永远年轻，健康长寿！{:4_205:}

梦油 发表于 2024-1-1 17:39

樵歌 发表于 2024-1-1 11:03
谢谢老哥的祝福！同祝您新年快乐！

谢谢，谢谢！{:5_108:}

樵歌 发表于 2024-1-1 18:49

红影 发表于 2024-1-1 13:53
那个很简单啊，只要去掉鸟儿的图片，也一样没有了呢

不敢乱动呀{:4_203:}

查看完整版本: 新年祝福 花潮新老朋友新年快乐