当我使用这个脚本时,它以红色结束,因为这是最后一个。所以不知何故我需要添加 z-index:+1 ?
jsfiddle.net/fourroses666/MCDw7
谁能帮我解决这个问题?
当我使用这个脚本时,它以红色结束,因为这是最后一个。所以不知何故我需要添加 z-index:+1 ?
jsfiddle.net/fourroses666/MCDw7
谁能帮我解决这个问题?
这不是您问题的答案,但可能是您正在寻求的解决方案。因此,如果您想要图像的连续褪色。你应该有两张图片,背景一张的不透明度设置为 1,前景一张从 0 渐变到 1。当它达到 1 后,你将前景图像放在背景中,并在前景中添加一个不透明度为 0 的新图像...
JS代码:
function changeImg(){
var img1 = document.getElementById("1");
var img2 = document.getElementById("2");
img1.src = img2.src;
$("#2").css({ opacity: 0 });
var randomNumber = Math.floor(Math.random()*(16*16*16 - 1));
var randomStr = randomNumber.toString(16);
img2.src = "http://dummyimage.com/50/" + randomStr + "/" + randomStr;
$('#2').delay(200).animate({opacity:1},150, function(){
changeImg();
});
}
$(document).ready(function(){
changeImg();
});
HTML 代码:
<div id="container">
<img id="1" src="http://dummyimage.com/50/000/000" />
<img id="2"/>
</div>
CSS 代码:
div img{
position:absolute;
width: 50px;
opacity:1;
}