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

完成animate CSS3動(dòng)畫庫照片墻響應(yīng)點(diǎn)擊事件案例。

Original 2019-03-23 12:25:05 298
abstrakt:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>animate動(dòng)畫照片墻</title> <link rel="stylesheet" href="./stat
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>animate動(dòng)畫照片墻</title>
<link rel="stylesheet" href="./static/css/style.css">
<link rel="stylesheet" href="./static/css/animate.min.css">
<script type="text/javascript" src="./static/js/jquery.js"></script>
</head>
<body>
<div>
<img src="./static/img/banner0.jpg" alt="">
<img src="./static/img/banner1.jpg" alt="">
<img src="./static/img/banner2.jpg" alt="">
<img src="./static/img/banner3.jpg" alt="">
<img src="./static/img/banner4.jpg" alt="">
<img src="./static/img/banner5.jpg" alt="">
<img src="./static/img/banner6.jpg" alt="">
<img src="./static/img/banner7.jpg" alt="">
<img src="./static/img/banner8.jpg" alt="">
<img src="./static/img/banner9.jpg" alt="">
<img src="./static/img/banner0.jpg" alt="">
<img src="./static/img/banner1.jpg" alt="">
<img src="./static/img/banner0.jpg" alt="">
<img src="./static/img/banner1.jpg" alt="">
<img src="./static/img/banner2.jpg" alt="">
<img src="./static/img/banner3.jpg" alt="">
<img src="./static/img/banner4.jpg" alt="">
<img src="./static/img/banner5.jpg" alt="">
<img src="./static/img/banner6.jpg" alt="">
<img src="./static/img/banner7.jpg" alt="">
<img src="./static/img/banner8.jpg" alt="">
<img src="./static/img/banner9.jpg" alt="">
<img src="./static/img/banner0.jpg" alt="">
<img src="./static/img/banner1.jpg" alt="">
</div>
</body>
<script type="text/javascript">
 var img_attr = ['bounce','flash','bounceOut','hinge','rollIn','rollOut','rotateIn','rotateInDownLeft','rotateInDownRight','rotateInUpLeft','rotateInUpRight'];

 $('img').on('click',function(){
  $('img').removeClass();
  var attr_rand = parseInt(Math.random()*10);
  $(this).addClass('animated '+ img_attr[attr_rand]); 
})
</script>
</html>
*{
	margin: 0px;
	padding: 0px;	
}
.img{
	margin: 20px auto;
	margin-left: 130px;
}
.img img{
	height: 100px;
	width: 325px;	
	margin-left: 15px;
	margin-top: 15px;
	cursor: pointer;
}

20190323120845.jpg


 $('img').on('click',function()}) 中的on表示在被選元素及子元素上添加一個(gè)或多個(gè)事件處理程序,on() 和 click() 的區(qū)別:二者在綁定靜態(tài)控件時(shí)沒有區(qū)別,但是如果面對動(dòng)態(tài)產(chǎn)生的控件,只有 on() 能成功的綁定到動(dòng)態(tài)控件中。

Korrigierender Lehrer:滅絕師太Korrekturzeit:2019-03-23 13:17:46
Zusammenfassung des Lehrers:完成的不錯(cuò),還課外拓展了一點(diǎn),學(xué)習(xí)習(xí)慣繼續(xù)保持哦!

Versionshinweise

Beliebte Eintr?ge