樵歌 发表于 2024-1-26 15:07

给姚云裳转个轱辘

<style>
#papa { left: -252px;top:120px; width: 1100px; height: 618px; background: gray url('https://pic.imgdb.cn/item/65b356e4871b83018ac4c922.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=2018733960.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>

樵歌 发表于 2024-1-26 15:08

读法：
三言：紫。织云裳，袖舞香，添国色。魏姚黄。
四言：紫织云裳，裳袖舞香。香添国色，色魏姚黄。
五绝：黄紫织云裳，云裳袖舞香。舞香添国色，国色魏姚黄。
七绝：魏姚黄紫织云裳，紫织云裳袖舞香。裳舞袖香添国色，香添国色魏姚黄。

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

@姚云裳

红影 发表于 2024-1-26 16:54

这个个轱辘姚字还是挺难嵌入的，师兄嵌得非常恰当。漂亮的轱辘诗{:4_199:}

红影 发表于 2024-1-26 16:55

很漂亮的嵌名轱辘诗，@姚云裳 收礼开心{:4_187:}

樵歌 发表于 2024-1-26 19:31

红影 发表于 2024-1-26 16:54
这个个轱辘姚字还是挺难嵌入的，师兄嵌得非常恰当。漂亮的轱辘诗

是的，这姚字组词很难的，幸好有牡丹这个名贵品种{:4_173:}

樵歌 发表于 2024-1-26 19:34

红影 发表于 2024-1-26 16:55
很漂亮的嵌名轱辘诗，@姚云裳 收礼开心

受字局限，只能照顾一两句的意境，其余只好凑合了

红影 发表于 2024-1-26 20:25

樵歌 发表于 2024-1-26 19:31
是的，这姚字组词很难的，幸好有牡丹这个名贵品种

被师兄借用得很巧妙{:4_187:}

红影 发表于 2024-1-26 20:26

樵歌 发表于 2024-1-26 19:34
受字局限，只能照顾一两句的意境，其余只好凑合了

很流畅自然呢，师兄不用谦虚啊{:4_204:}

姚云裳 发表于 2024-1-26 20:34

都是有才人，文字方面是我的弱项，只能欣赏，这轱辘转得我{:6_234:}{:7_282:}

樵歌 发表于 2024-1-27 11:30

红影 发表于 2024-1-26 20:25
被师兄借用得很巧妙

没办法呀，估计师妹凑时也会用到这个词的{:4_189:}

樵歌 发表于 2024-1-27 11:31

红影 发表于 2024-1-26 20:26
很流畅自然呢，师兄不用谦虚啊

该谦虚就不能客气{:4_173:}

樵歌 发表于 2024-1-27 11:31

姚云裳 发表于 2024-1-26 20:34
都是有才人，文字方面是我的弱项，只能欣赏，这轱辘转得我

二楼有读法呢。{:4_173:}

红影 发表于 2024-1-27 14:14

樵歌 发表于 2024-1-27 11:30
没办法呀，估计师妹凑时也会用到这个词的

我没试过，不知道会凑成什么样的组词{:4_173:}

红影 发表于 2024-1-27 14:16

樵歌 发表于 2024-1-27 11:31
该谦虚就不能客气

师兄把这个文体一直光大着，真好{:4_187:}

樵歌 发表于 2024-1-27 21:18

红影 发表于 2024-1-27 14:14
我没试过，不知道会凑成什么样的组词

要不以后才高个轱辘同题吧{:4_173:}

樵歌 发表于 2024-1-27 21:19

红影 发表于 2024-1-27 14:16
师兄把这个文体一直光大着，真好

因为平时也没有诗兴呵。

红影 发表于 2024-1-27 21:54

樵歌 发表于 2024-1-27 21:18
要不以后才高个轱辘同题吧

好啊，师兄有兴趣就弄个啊{:4_173:}

红影 发表于 2024-1-27 21:54

樵歌 发表于 2024-1-27 21:19
因为平时也没有诗兴呵。

师兄什么时候把轱辘诗收集起来，应该也是不少呢{:4_187:}
页: [1]
查看完整版本: 给姚云裳转个轱辘