在调用动画的时候加个infinite参数即可，比如：
animation:mymove 5s infinite
-webkit-animation:mymove 5s infinite
jQuery的可以实现：1.fadeIn（速度，[回调]）通过改变所有匹配元素的不透明度来实现淡入效果，并在动画可选地触发一个回调函数后完成。这个动画只调整元素的不透明度，即所有匹配元素的高度和宽度不会改变。
参数速度（字符串，数字）：三种预定速度字符串（“慢”，“正常”或“快速”）长的毫秒数值（如：1000）的一个表示动画或
回调（功能）：（可选）（可选）例如600毫秒缓慢淡入一段
代码：$（“P”）淡入（“慢“）
用200毫秒快速褪色的段落，然后会弹出一个对话框jQuery代码：。“动画完成”$（“P”）淡入（“快”，函数（）{
警报（ ）
}）
2.fadeOut（速度，[回调]）通过改变不透明度来实现所有匹配淡入淡出效果的元素，并在动画完成后可选地触发一个回调函数。这个动画只调整元素的不透明度，即所有匹配元素的高度和宽度不会改变。
参数速度（字符串，数字）：三种预定速度字符串（“慢”，“正常”或“快速”）长的毫秒数值（如：1000）的一个表示动画或
回调（功能）：（可选）功能例如与段落600毫秒缓慢褪色
代码：$（“P”）。淡出（“慢”）
200毫秒段对话
代码后迅速褪色。 $（“P”）淡出（“快”，函数（）{
警报（“动画完成。”）
}）
3.fadeTo（速度，透明度，[回调]），所有匹配的元素逐步调整到指定的不透明度，并可选地触发一个回调函数完成动画后的不透明度。这个动画只调整元素的不透明度，即所有匹配元素的高度和宽度不会改变。
参数速度（字符串，数字）：表示动画或
不透明度（：三种预定速度弦长的毫秒值（1000例）（“慢”，“正常”或“快速”）之一号）：调整0和1）的回调（功能）之间的不透明度值（数。 （可选）功能 600毫秒，以缓慢调整到0.66段，能见度的透明度有关的
码2/3。 $（“p”）的fadeTo（“慢”，0.66）$（“P”）。fadeTo（“慢”，0.66）
同款200毫秒快速调整到0.25，能见度约1/4的透明度，然后会弹出一个对话框jQuery代码：$（“P”）。 fadeTo（“快”，0.25，函数（）{
警报（）“动画完成。”
}）
通过按钮的click事件反复触发一个元素的css3动画，点击一次，动画效果就跑一次。
看码——
html：
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>测试页面</title>
<script id="jquery_183" type="text/javascript" src="//runjs.cn/js/sandbox/jquery/jquery-1.8.3.min.js"></script>
</head>
<body>
<div id="testDiv01">
</div>
<button id="testBtn01">反复触发transition</button>
<br>
<div id="testDiv02">
</div>
<button id="testBtn02">反复触发animation</button>
</body>
javascript：
let [testDiv01,testDiv02,testBtn01,testBtn02]=[$('#testDiv01'),$('#testDiv02'),$('#testBtn01'),$('#testBtn02')]testBtn01.on('click',function () {
testDiv01.addClass('transi')
let t = setTimeout(()=>{
testDiv01.removeClass('transi')
clearTimeout(t)
},500)
})
testBtn02.on('click',function () {
testDiv02.addClass('ani')
let t = setTimeout(()=>{
testDiv02.removeClass('ani')
clearTimeout(t)
},500)
})
css：
body {padding: 20px
}
.testDiv {
width: 100px
height: 100px
border-radius: 50%
background-color: #e0a718
}
.testDiv.ani {
-webkit-animation: pop 200ms ease 0ms
animation: pop 200ms ease 0ms
}
.testDiv.transi {
-webkit-transform: scale(1.2)
transform: scale(1.2)
-webkit-transition: -webkit-transform 0.5s
transition: -webkit-transform 0.5s
transition: transform 0.5s
transition: transform 0.5s, -webkit-transform 0.5s
}
.testBtn {
margin-top: 20px
height: 30px
padding: 0px 10px
border: 1px solid #CCCCCC
}
@-webkit-keyframes pop {
0% {
-webkit-transform: scale(0)
transform: scale(0)
}
50% {
-webkit-transform: scale(1.2)
transform: scale(1.2)
}
100% {
-webkit-transform: scale(1)
transform: scale(1)
}
}
@keyframes pop {
0% {
-webkit-transform: scale(0)
transform: scale(0)
}
50% {
-webkit-transform: scale(1.2)
transform: scale(1.2)
}
100% {
-webkit-transform: scale(1)
transform: scale(1)
}
}
