樵歌 发表于 2025-1-13 19:34

回文轱辘贺朵拉芳辰

<style>
#papa { left: -252px;top:120px; width: 1100px; height: 618px; background: gray url('https://pic1.imgdb.cn/item/6784f893d0e0a243d4f3f05d.jpg')
no-repeat center/cover; box-shadow: 4px 4px 24px #000; position: relative; }
#mama { position: absolute; left: 100px; top: calc(50% - 140px); display: grid; place-items: center; width: 360px; height: 360px; cursor: pointer; }
#tit { position: absolute; left: 26px; top: 46px; font: bold 26px / 26px sans-serif; color: #4D0CAF; 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,.4); 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 style="position: absolute; left:560px; top: 250px; width:451px;">
   <img alt="" src="https://pic.imgdb.cn/item/62479cbe27f86abb2adbb9bd.gif"/></div>
</div><br><br><br><br><br><br>

<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=82932.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>



樵歌 发表于 2025-1-13 19:34

读法
三言：朵，朵云归，梦倚扉，拉瑟弄，雪花飞。
四言：朵朵云归，归梦倚扉。扉拉瑟弄，弄雪花飞。
五绝：飞朵朵云归，云归梦倚扉。倚扉拉瑟弄，瑟弄雪花飞。
七绝：雪花飞朵朵云归，朵朵云归梦倚扉，归梦倚扉拉瑟弄，扉拉瑟弄雪花飞。


注：拉瑟，风声之意。

樵歌 发表于 2025-1-13 19:36

@朵拉

马黑黑 发表于 2025-1-13 19:41

轱辘诗高手，豆包高手

梦油 发表于 2025-1-13 19:44

随着樵歌朋友带来的美曲，祝福朵拉生日快乐！

小辣椒 发表于 2025-1-13 20:22

朵拉生日了啊，小辣椒先樵哥哥的贺帖送上祝福，祝朵拉生日快乐！

小辣椒 发表于 2025-1-13 20:22

费玉清的一剪梅，太好听了。樵哥哥真会选歌{:4_178:}

樵歌 发表于 2025-1-13 21:19

小辣椒 发表于 2025-1-13 20:22
费玉清的一剪梅，太好听了。樵哥哥真会选歌

这方面你是师傅，都跟着你学的呗{:4_189:}

樵歌 发表于 2025-1-13 21:20

马黑黑 发表于 2025-1-13 19:41
轱辘诗高手，豆包高手

吃豆包的高手{:4_170:}

马黑黑 发表于 2025-1-13 21:21

樵歌 发表于 2025-1-13 21:20
吃豆包的高手

比吃瓜高端

樵歌 发表于 2025-1-13 21:22

梦油 发表于 2025-1-13 19:44
随着樵歌朋友带来的美曲，祝福朵拉生日快乐！

我也看到红影发的帖子，都没回就去做了。轱辘诗我十来分钟搞定，豆包制图几分钟，找歌就想了好久呢。

红影 发表于 2025-1-13 21:37

这首签字的轱辘诗不容易，朵儿的那个拉字不容易嵌呢，师兄还专门找了个拉瑟词组来嵌呢。
欣赏师兄好帖，祝朵宝生日快乐{:4_187:}{:4_177:}

红影 发表于 2025-1-13 21:39

这个制作也漂亮，欣赏师兄好帖{:4_187:}

梦油 发表于 2025-1-14 13:42

樵歌 发表于 2025-1-13 21:22
我也看到红影发的帖子，都没回就去做了。轱辘诗我十来分钟搞定，豆包制图几分钟，找歌就想了好久呢。

你写轱辘诗真是一绝。

朵拉 发表于 2025-1-14 15:29

樵歌 发表于 2025-1-13 19:36
@朵拉

轱辘诗高手，我有认真在看，
共转16回，太精彩了，谢谢樵歌{:4_204:}

樵歌 发表于 2025-1-15 14:26

梦油 发表于 2025-1-14 13:42
你写轱辘诗真是一绝。

自从@红影 用来玩了以后，我就乐此不彼，以后转了怕是有百把个了，现在套路很熟悉。

樵歌 发表于 2025-1-15 14:29

朵拉 发表于 2025-1-14 15:29
轱辘诗高手，我有认真在看，
共转16回，太精彩了，谢谢樵歌

把你转晕了没{:4_189:}

梦油 发表于 2025-1-15 14:44

樵歌 发表于 2025-1-15 14:26
自从@红影 用来玩了以后，我就乐此不彼，以后转了怕是有百把个了，现在套路很熟悉。

真不愧为才子。{:5_116:}

红影 发表于 2025-1-15 21:12

樵歌 发表于 2025-1-15 14:26
自从@红影 用来玩了以后，我就乐此不彼，以后转了怕是有百把个了，现在套路很熟悉。

哈哈，是师兄把它广大了呢{:4_173:}
页: [1]
查看完整版本: 回文轱辘贺朵拉芳辰