基于javascript实现随机颜色变化效果
本文实例讲解了基于javascript实现随机颜色变化效果,分享给大家供大家参考,具体内容如下
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>随机颜色变化效果</title>
<styletype="text/css">
#thediv{
width:100px;
height:100px;
}
</style>
<scripttype="text/javascript">
varcolorList=["#FFFF99","#B5FF91","#94DBFF","#FFBAFF","#FFBD9D","#C7A3ED","#CC9898","#8AC007"];
for(vari=0;i<colorList.length;i++){
varbgColor=getColorByRandom(colorList);
}
functiongetColorByRandom(colorList){
varcolorIndex=Math.floor(Math.random()*colorList.length);
varcolor=colorList[colorIndex];
colorList.splice(colorIndex,1);
returncolor;
}
window.onload=function(){
varodiv=document.getElementById("thediv");
functionfunc(){
odiv.style.backgroundColor=getColorByRandom(colorList);
}
setInterval(func,1000);
}
</script>
</head>
<body>
<divid="thediv"></div>
</body>
</html>
另一个js函数实现随机颜色:
functionrandomcolor()
{
varcolorvalue=["0","2","3","4","5","6","7","8","9","a","b","c","d","e","f"],
colorprefix="#",
index;
for(vari=0;i<6;i++){
index=Math.round(Math.random()*14);
colorprefix+=colorvalue[index];
}
returncolorprefix;
}
vartest=randomcolor();
alert(test);
以上就是本文的全部内容,希望对大家的学习javascript程序设计有所帮助。
