返回获取随机颜色...登陆

获取随机颜色

wjho2o2019-02-15 16:57:32187

总结:

真是少个空格,都会出问题。要细心一点。。

代码:

<!DOCTYPE html>

<html>

<head>

<title>获取随机颜色</title>


<style type="text/css">

a{

float:left;

display:block;

margin:50px;

width:100px;

height:100px;

text-align: center;

line-height: 100px;

background-color:#ffe411;

text-decoration: none;

border-radius: 50px;

}

</style>

<script type="text/javascript" src="jq.js"></script>

<script type="text/javascript">

//改变标签的背景颜色

function aa(tag){

var len = document.getElementsByTagName(tag).length;

for(var i=0; i<len; i++){

document.getElementsByTagName(tag)[i].style.backgroundColor = 'rgb(' + Math.floor(Math.random()*256) + ',' + Math.floor(Math.random()*256) + ',' + Math.floor(Math.random()*256) + ')';

}

}


$(document).ready(function(){

aa('a');

$('a').mouseover(function(){

$bg = $(this).css('backgroundColor');

$(this).css('box-shadow', '0px 0px 20px ' + $bg); //20px 后面有个空格,调试了半天。我的天。

$(this).css('border-radius', '20px');

})


$('a').mouseleave(function(){

$(this).css('box-shadow', 'none');

$(this).css('border-radius', '50px');

})

})

</script>

</head>

<body>


<a href="#">1</a>

<a href="#">2</a>

<a href="#">3</a>

<a href="#">4</a>

</body>

</html>


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送