我正在建立一个网站/应用程序，一次将显示六个不同的图像。这些图像的内容是从另一个站点加载的，并且会定期更改。屏幕上将显示任何特定图像的位置取决于屏幕上已经存在的所有图像的状态。
为了获得图像，我使用jQuery更改了src6个img位置之一的属性，然后使用jQuery等待加载load()，然后显示它。但是，这意味着我必须在加载图像之前选择我的位置。我遇到的问题是，从启动加载到图像最终加载时，该图像的正确位置可能已更改。
所以我的问题是，是否有加载图像屏幕外的方式（说在一个隐藏的img），然后，当它的加载，把它作为成品的通知，然后移到该图像到正确的位置在那一刻。
我在StackOverflow上发现了很多预加载问题和答案，但是它们都假定您知道启动加载时映像要移到的位置。
更新：更多地考虑这个问题，也许是另一种构图方法：1）如果我将图像从非现场服务器加载到屏幕外/隐藏img并等待其加载，2）随后将设置src屏幕上/可见的属性img在相同的图像URL从服务器或浏览器缓存中汲取什么经验？换句话说，如果我在屏幕外加载远程图像，对同一图像的下一个请求是否会返回到服务器或浏览器缓存（对于所有浏览器来说，这是一致的）吗？
一种方法：
function loadImg(url, callback, key) {
var image = new Image();
image.onload = function() {
callback(image, key)
};
image.onerror = function() {};
image.src = url;
}
function imageOnload(image, key) {
imageGoesTo[key].src = image.src
}
var imageGoesTo = {
"firstPicture": document.getElementById("img1"),
"secondPicture": document.getElementById("img2"),
}
loadImg("http://7pi.azurewebsites.net/img/DSC09906.jpg", imageOnload, "firstPicture")
imageGoesTo["secondPicture"] = document.getElementById("img3")
loadImg("http://7pi.azurewebsites.net/img/DSC07934.jpg", imageOnload, "secondPicture")<img id="img1" alt="loading">
<img id="img2" alt="loading">
<img id="img3" alt="loading">本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句