<html>
<head>
<style>
img{
margin: 0;
width: 50%;
}
</style>
</head>
<body>
<img src="" alt=""><img src="" alt="">
<script>
var arr = ['1.jpg','2.jpg','3.jpg','4.jpg','5.jpg'];
var arr2 = ['6.jpg','7.jpg','8.jpg','9.jpg','10.jpg'];
var img = document.querySelectorAll('img'), i = 0;
setInterval(()=>{
img[0].src = arr[i];
setTimeout(()=>img[1].src = arr2[i],500);
i++;
if (i==5) i=0;
},1000);
</script>
</body>
</html>
