abstract:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>获取随机颜色</title> </head> <style type='text/css'> a{display:bl
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>获取随机颜色</title> </head> <style type='text/css'> a{display:block; width: 100px; height: 100px; line-height: 100px; text-align: center; margin:100px ; border-radius: 50px; float: left; text-decoration: none; color:white; transition: All 0.4s ease-in-out; } </style> <script type='text/javascript' src="jquery-3.3.1.js"></script> <script type="text/javascript"> function color(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(){ color('a') $('a').mouseover(function(){ $bg=$(this).css('backgroundColor') $(this).css('box-shadow','0 0 20px '+$bg) $(this).css('border-radius','20px') $(this).css('transform','scale(1.5)') }) $('a').mouseleave(function(){ $(this).css('box-shadow','none') $(this).css('border-radius','50px') $(this).css('transform','scale(1)') }) }) </script> <body> <a href="">1</a> <a href="">2</a> <a href="">3</a> <a href="">4</a> <div>Math.floor() 取整<br> Math.random()*256获取随机数 </div> </body> </html>
Correcting teacher:天蓬老师Correction time:2019-01-01 15:17:35
Teacher's summary:Math.random()*256)+','+Math.floor(), Math是一个非常重要有用的原生内置对象, 很多与计算相关的运算都要用到它的