<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="animate.css" />
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.animated {
transition: all 0.2s;
-webkit-transition: all 0.2s;
}
</style>
</head>
<body>
<div style="background-color: #CCCCCC; overflow: hidden; line-height: 50px;height: 50px;">
<ul id="wenzi">
</ul>
</div>
<script>
let strArr = [
'111111111111111剪粉丝看撒的发生的塑料袋口附近按时',
'2222222222222fjdlsssssk老地方付付付付付付付付付付付付军扩',
'33333333333333福建省多绿扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩扩军',
];
let wz = document.getElementById('wenzi');
let i = 1;
wz.innerHTML = `<li class='animated slideInUp'> ${strArr[0]} </li>`;
let startMarquee = function() {
wz.innerHTML = `<li class='animated slideInUp'> ${strArr[i]} </li>`;
i++;
if(i >= strArr.length) i = 0;
};
// startMarquee();
setInterval("startMarquee()", 1500);
</script>
</body>
</html>
无间隙
success = function (data) {
let strArr = data.data.results;
console.log(strArr);
let winList = document.getElementById('winning-list');
let i = 1, j = 2;
winList.innerHTML = `<div class="animated slideOutUp">
<img src="${strArr[0].headImgUrl}" alt="" class="winPic">
<span class="winGifBox"><span class="winGif">${strArr[0].nickName}</span>获得了一份奖品</span>
</div>
<div class="animated slideInUp">
<img src="${strArr[1].headImgUrl}" alt="" class="winPic">
<span class="winGifBox"><span class="winGif">${strArr[1].nickName}</span>获得了一份奖品</span>
</div>`;
listAnimate = function () {
winList.innerHTML = `<div class="animated slideOutUp">
<img src="${strArr[i].headImgUrl}" alt="" class="winPic">
<span class="winGifBox"><span class="winGif">${strArr[i].nickName}</span>获得了一份奖品</span>
</div>
<div class="animated slideInUp">
<img src="${strArr[j].headImgUrl}" alt="" class="winPic">
<span class="winGifBox"><span class="winGif">${strArr[j].nickName}</span>获得了一份奖品</span>
</div>`;
i++;
j++;
if (i >= strArr.length) i = 0;
if (j >= strArr.length) j = 0;
};
setInterval("listAnimate()", 2000);
if (strArr.length < 1) {
clearInterval(listAnimate());
}
}