单击时加载图像阵列并加载下一个图像
Load image array and load next images, when clicking
我正在尝试构建一个带有x个图像的渐进滑块。意思是,在页面加载时,滑块在滑块容器中加载3个图像,无论数组包含多少图像。
单击next/prev应将前3个图像滑动到任意一侧,然后加载下3个图像(如果有)。
它应该将下一个索引号发送到下一个函数,并在单击时增加/减少。
这有意义吗?:)这是我制作的一个快速模型。。。欢迎任何想法:O)
THX!!!
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();
要获得最佳体验,您至少应该预加载前3个和后3个图像
你也可以做一些类似的事情
var imageList = [];
for(...)
{
var img = new Image();
img.src = '';
imageList.push(img);
}
将它们保存在缓存中
使用9个图像占位符(中央3个,每侧3个),然后只应用
imgNode.src = imageList[x].src
相关文章:
- 如何在谷歌字体加载时显示加载图像
- 预加载图像并插入DOM
- 加载图像时加载图标
- 在页面启动期间加载图像
- 预加载图像image.onload脚本MVC
- 可以't在我的React组件中加载图像
- 加载图像后调整HTML画布的大小
- HTML/JS github页面项目没有't在使用firefox运行时加载图像或声音
- 错误:$injector:modulerr加载图像时模块处于角度
- 谷歌地图加载后隐藏加载图像
- 在照片查看器(Javascript和jQuery)中异步加载图像时可能出现错误
- 正在从字节数组加载图像内容
- 网页上已有tinymce加载图像列表
- 单击提交按钮后加载图像将冻结
- 如何使用Express'正确加载图像;s的静态中间件
- 使用jquery即时加载图像
- Html5画布使用JCanvasScript加载图像
- Javascript使用JCanvaScript在画布中加载图像
- 使用jquery/ajax显示加载图像
- ajax缓存false无法加载图像