■ 이미지 페이드 인아웃 효과
<style>
.imgbox{
position: relative;
}
.img{
position: absolute;
left: 0%;
top: 0%;
}
</style>
<body>
<div class="imgbox">
<div class="img">
<img src="https://picsum.photos/id/2/200/300" alt="">
</div>
<div class="img">
<img src="https://picsum.photos/id/20/200/300" alt="">
</div>
<div class="img">
<img src="https://picsum.photos/id/200/200/300" alt="">
</div>
</div>
<script>
let i = 0;
$(".img").hide().first().show();
setInterval(
function(){
let ni = (i+1) % 3;
$(".img").eq(i).fadeOut(1500);
$(".img").eq(ni).fadeIn(1500);
i = ni;
}
,4000);
</script>
</body>