我正在尝试在此幻灯片放映中获得交叉幻灯片效果,但无法正常工作。问题是,我想要一个 div 背景图像的过渡。希望有人可以帮助我。(HTML 和 CSS 工作正常,因为通过动画工作淡入/淡出)
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
var imgArr = new Array( // relative paths of images
'images/slide3.jpg',
'images/slide4.jpg',
'images/slide3.jpg',
'images/slide4.jpg'
);
var preloadArr = new Array();
var i;
/* preload images */
for(i=0; i < imgArr.length; i++){
preloadArr[i] = new Image();
preloadArr[i].src = imgArr[i];
}
var currImg = 1;
var intID = setInterval(changeImg, 6000);
/* image rotator */
function changeImg(){
$('#parallax-background').animate({opacity: 0}, 1000, function(){
$(this).css('background','url(' + preloadArr[currImg++%preloadArr.length].src +') 50% 0 no-repeat fixed');
}).animate({opacity: 1}, 1000);
}
});
</script>