按红影的要求手链可以单击后同色
本帖最后由 马黑黑 于 2022-4-16 20:15 编辑 <br /><br /><style type="text/css">.outer {
--len: 240px;
margin: 50px auto 0;
display: flex;
justify-content: center;
align-items: center;
width: var(--len);
height: var(--len);
position: relative;
border-radius: 50%;
border: 1px solid red;
}
.outer div {
position: absolute;
width: calc(var(--len) / 5);
height: calc(var(--len) / 5);
border-radius: 50%;
}
.outer div::before {
content: '';
position: absolute;
width: inherit;
height: inherit;
border-radius: 50%;
background: radial-gradient(at 35% 40%, rgba(255,255,255,.5), rgba(0,0,255,.1));
}
.tipBox { color: red; margin-top: 100px;}
</style>
<div class="outer"></div>
<div class="tipBox"></div>
<script language="javascript">
let outer = document.querySelector(".outer");
let width = outer.clientWidth;
let total = 16;
let angle = 360 / total;
let str = "";
for(j=0; j<total; j++) {
let transform = `rotate(${angle * j}deg) translateY(-${width / 2}px) rotate(${360 - angle*j}deg)`;
let cc = `linear-gradient(120deg,#${Math.random().toString(16).substr(-6)},#${Math.random().toString(16).substr(-6)})`;
str += `<div onclick="same(this)" style="transform: ${transform}; background: ${cc};"></div>\n`;
}
outer.innerHTML = str;
function same(ele) {
let bc = ele.style.background;
Array.from(outer.children).forEach(function(item){item.style.background = bc; });
document.querySelector(".tipBox").innerText =`background: ${bc};`;
}
</script>
每次打开，看中哪一颗，单击它，所有的珠子就跟它一个颜色 一点就变淡绿色了，{:4_187:}漂亮 {:4_190:} 漂亮，马黑特棒{:4_199:} 大猫咪 发表于 2022-4-16 19:57
一点就变淡绿色了，漂亮
喜欢哪一颗点哪一颗 闲言不语 发表于 2022-4-16 20:00
漂亮，马黑特棒
一般般倒数第三 背景信息也给提供出来了 马黑黑 发表于 2022-4-16 19:53
每次打开，看中哪一颗，单击它，所有的珠子就跟它一个颜色
而且知道了自己喜欢的珠子配色是由什么颜色组成的。这个太棒了{:4_199:} 我刷新一下，选个最喜欢的颜色，再刷新，再选个，很快就发现，原来我最喜欢的颜色组合基本偏向于浅色系呢。能知道自己喜欢的颜色代码是什么了，这个太开心了{:4_187:} 颜色的组合是无穷无尽的，我不停地选，这个早上，选了好多串晶莹的手链给自己，而且都是自己喜欢的{:4_173:} 这个简直是趣味小游戏一样。
我收藏了，争取每次上来都来这个帖子里选一串手链愉悦一下自己，然后再回帖{:4_205:}
这些珠子太美了，简直让人陶醉，而最让自己迷醉的那串，可以自己动手挑出来。这简直是最大的福利{:4_199:} 红影 发表于 2022-4-17 07:06
这些珠子太美了，简直让人陶醉，而最让自己迷醉的那串，可以自己动手挑出来。这简直是最大的福利
你是要一串还是要一粒的背景色呢 红影 发表于 2022-4-17 06:57
而且知道了自己喜欢的珠子配色是由什么颜色组成的。这个太棒了
我理解成是基于某一粒珠子的，这里提供的是单粒珠子的背景设置。需要全部的话也是可以的。 哇，这个太漂亮了，厉害厉害。{:4_199:} 加林森 发表于 2022-4-17 17:52
哇，这个太漂亮了，厉害厉害。
还行还行 马黑黑 发表于 2022-4-17 19:02
还行还行
送几串出来玩玩。{:4_189:} 加林森 发表于 2022-4-17 19:25
送几串出来玩玩。
可以可以 马黑黑 发表于 2022-4-17 20:02
可以可以
拿来。。。。{:4_189:} 加林森 发表于 2022-4-17 20:57
拿来。。。。
自己动手