0

我正在尝试使用 x 图像构建一个渐进式滑块。意思是，在页面加载时，无论数组包含多少图像，滑块都会在滑块容器中加载 3 个图像。

单击下一个/上一个应该将前 3 个图像滑动到任一侧，然后加载下 3 个（如果有）。

它应该将下一个索引号发送到下一个函数并在点击时增加/减少。

这有道理吗？:) 这是我制作的快速模型...欢迎任何想法 :O)

谢谢！！！

var aImages = new Array("image1.jpg","image2.jpg","image3.jpg");
var slideImage = 1;

function showImages()
{
    var startImage = (slideImage -1)*6+1;
    var endImage = (startImage +5);

    for(i=startImage ; i <= endImage ; i++)
    {
        $('imageId'+ i).src = aImages[i];
        slideImage ++;
    }

}

function slideImages()
{        
    var startImage = (slideImage -1)*6+1;
    var endImage = (startImage +5);

    for(i=startImage ; i <= endImage ; i++)
    {
        $('imageId'+ i).src = aImages[i];
    }
}   

slideImages();
4

1 回答 1

1

为了获得最佳体验，您至少应该预加载前 3 张和后 3 张图片

你也可以做类似的事情

var imageList = [];
for(...)
{

    var img = new Image();
    img.src = '';
    imageList.push(img);

}

将它们保存在缓存中

并使用 9 个图像占位符（中央 3 个，每侧 3 个），然后只需应用

imgNode.src = imageList[x].src
于 2013-02-08T14:40:03.963 回答