亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

產(chǎn)生隨機(jī)顏色和隨機(jī)數(shù)功能的實現(xiàn)

??? 2019-01-30 11:24:44 288
????：一、主要功能1、按下“刷新”按鈕，矩形產(chǎn)生隨機(jī)顏色和隨機(jī)數(shù)2、移動到矩形上，變成圓形二、功能代碼<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>隨機(jī)顏色和隨機(jī)數(shù)功能的實現(xiàn)<

一、主要功能

1、按下“刷新”按鈕，矩形產(chǎn)生隨機(jī)顏色和隨機(jī)數(shù)

1.png

2、移動到矩形上，變成圓形

2.png

二、功能代碼

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>隨機(jī)顏色和隨機(jī)數(shù)功能的實現(xiàn)</title>
<script src="../jquery-3.3.1.js"></script>
<style>
a{
display: inline-block;
width: 100px;
height: 100px;
margin: 30px;
border: 1px solid #ccc;
text-align: center;
line-height: 100px;
text-decoration: none;
}
</style>
</head>
<body>
<div>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
<button>刷新</button>

<script>
//利用js設(shè)置隨機(jī)顏色和數(shù)字值
function getRandom(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()*255)+','+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+')'
document.getElementsByTagName(tag)[i].innerHTML=Math.floor(Math.random()*100)
}
}

//利用jq實現(xiàn)動畫效果
$(function(){
getRandom('a')
$('button').click(function(){
getRandom('a')
})

$('a').hover(function(){
var color = $(this).attr('backgroundColor')
$(this).css({'box-shadow':'0px 0px 20px'+color,'border-radius':'50%'})
},function(){
$(this).css({'box-shadow':'','border-radius':''})
})
})
</script>
</body>
</html>


?? ???：韋小寶?? ??：2019-01-30 13:27:01
???? ??：不錯不錯 寫的很棒 這種小案例可以幫助我們快速的掌握很多知識點 沒事的時候要多練習(xí)哦

??? ??

?? ??