У меня есть рамка изображения, которая постоянно и быстро меняет изображения, когда пользователи перетаскивают рамку.Эти изображения генерируются в режиме реального времени на основе взаимодействия с пользователем, поэтому каждое сгенерированное изображение должно быть загружено, как только оно станет доступным.Максимальная скорость может составлять 5 изображений в секунду.Однако при использовании Safari / Chrome у меня возникает проблема мерцания изображения.На Firefox такой проблемы нет.Каждый раз, когда изображение изменяется, сервер будет давать браузерам новую ссылку для загрузки нового изображения.Рамка изображения заменит новое изображение, когда Javascript обнаружит, что изображение загружено полностью.Код, который я использовал для определения полноты загрузки, показан ниже.
SImage = function(callback) // Define an image class with callback function
{
var _this = this;
var appname = navigator.appName.toLowerCase();
_this.img = new Image();
_this.get = function(url, answer){
if (appname.indexOf("netscape") == -1){ // for IE
_this.img.onreadystatechange = function () {
if (_this.img.readyState == "complete"){
callback(_this.img.src);
}
};
} else { //other browsers, firefox, safari, chrome
_this.img.onload = function () {
if (_this.img.complete){
callback(_this.img.src);
}
};
}
_this.img.src = url;
}
};
И я использую jquery для изменения фона изображения.класс.
Я также записал эту проблему на видео youtube , надеюсь, кто-то может понять мой вопрос и помочь мне.Если я пропущу какую-то важную информацию, которая поможет решить проблему, пожалуйста, укажите.Спасибо!