使用jquery动态追加和交叉渐变图像

Appending and crossfade images dynamically with jquery

本文关键字:渐变 图像 jquery 动态 追加 使用      更新时间:2023-09-26

这就是我现在拥有的:

<div id="nhs_BasicSearchBox">
    <img src="img1.jpg" />
    <img src="img2.jpg" />
</div>

但我真正想做的是动态添加图像:

<div id="nhs_BasicSearchBox"></div>

这是我的jquery:

$('img').hide();
function animg() {
    $("#nhs_BasicSearchBox img").first().appendTo('#nhs_BasicSearchBox').fadeOut(1500);
    $("#nhs_BasicSearchBox img").first().fadeIn(1500);
    setTimeout(animg, 6000);
}
animg();

我有点迷路了。有什么帮助吗?这是我的小提琴。谢谢

您可以创建图像链接数组,然后使用for循环将具有这些链接的新<img>作为src附加到容器:

Fiddle。

var imageLinks = ["link1", "link2"];
var container = $("#nhs_BasicSearchBox");
for (var i = 0; i < imageLinks.length; i++)
{
    container.append($('<img>', { src: imageLinks[i] }));
}