通知
  • 关于网站更多信息请加QQ群(1061691290)
  • jpress升级到4.x,显示有些问题,修复中
  • 网站还会持续更新

10行代码实现渐变背景色(背景色不突变,可以取遍所有颜色)

1600人浏览 / 1人评论 / | 作者:whisper  | 分类: whimurmur模板  | 标签: 模板  | 

作者:whisper

链接:https://www.proprogrammar.com/article/826

声明:请尊重原作者的劳动,如需转载请注明出处


whimurmur帮助文档中的内容背景

先看代码

colors = [parseInt(Math.random()*256),parseInt(Math.random()*4) * 2 + 2,parseInt(Math.random()*256),parseInt(Math.random()*4) * 2 + 2,parseInt(Math.random()*256),parseInt(Math.random()*4) * 2 + 2];
function initChangingBg(){
    $(".cl-artical-content").css("background-color", 'rgba(' + colors[0] + ', ' + colors[2] + ', ' + colors[4] + ', 0.5)');
	for(var i = 0; i < 6; i += 2){
		(colors[i] + colors[i+1] > 255 && (colors[i+1] = -parseInt(Math.random()*4) * 2 - 2)) || (colors[i] + colors[i+1] < 0 && (colors[i+1] = parseInt(Math.random()*4) * 2 + 2));
		colors[i] += colors[i+1];
	}
	setTimeout(initChangingBg, 100);
}
initChangingBg();

再看效果


亲爱的读者:有时间可以点赞评论一下

点赞(1) 打赏

全部评论

whisper
2020-09-14 09:05
<p>上面颜色取值有个问题,只能取到偶数,把+2改成+1,*2去掉就能取遍所有颜色了</p>