Javascript 过渡背景图像开关

我希望我的背景图像每x秒切换一次，所以我使用了这种方法

但我有一个问题，切换非常突然，有没有办法在这方面进行转换

var图像=[
"https://www.royalcanin.com/~/media/Royal Canin/Product Categories/cat成人登陆英雄.ashx“，
"https://placehold.it/1920x1080",
"https://upload.wikimedia.org/wikipedia/commons/4/4d/Cat_March_2010-1.jpg"
]
var imageHead=document.getElementById（“图像头”）；
var i=0；
setInterval（函数（）{
imageHead.style.backgroundImage=“url（“+images[i]+””）；
i=i+1；
if（i==images.length）{
i=0；
}
}, 5000);
body，html{
身高：100%；
保证金：0；
}
.图像头{
背景：url（'https://placehold.it/1920x1080'）无重复上止点固定；
背景尺寸：封面；
身高：100%；
宽度：100%；
保证金：0；
填充：0；
颜色：黑色；
文本对齐：居中；
}


一些HTML
什么样的过渡？褪色幻灯片？@Temaniaf如果淡出效果最好