jquery 随机颜色 加boxshadow,老师请通过下,谢谢

原创 2018-12-16 23:28:03 201
摘要:<!DOCTYPE html><html><head> <title></title> <script type="text/javascript" src="jquery-3.3.1.min.js"></script> <style type="text/c

<!DOCTYPE html>

<html>

<head>

<title></title>

<script type="text/javascript" src="jquery-3.3.1.min.js"></script>

<style type="text/css">

a{float: left;display: block;width: 100px;height: 100px;margin:50px;line-height: 100px;text-align: center;color: #fff;border-radius: 50px;text-decoration: none;}

</style>

</head>

<body>

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

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

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

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

<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)+')'

}

// body...

}

$(document).ready(function(){

aa('a');

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

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

$(this).css('boxShadow','0px 0px 10px '+$bg)

$(this).css('borderRadius','10px')

})

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

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

$(this).css('boxShadow','none')

$(this).css('borderRadius','50px')

})

})

</script>

</body>

</html>

老师请审核通过下,谢谢;

批改老师:灭绝师太批改时间:2018-12-17 09:22:48
老师总结:完成的不错,作业和课程内容掌握的不错,继续加油!

发布手记

热门词条