Блог

Я создаю ajax-слайдер для отображения изображений. Это работает отлично, но проблема заключается в кэше изображений. когда изображения меняются, поскольку это загрузка ajax, здесь нет кэша, и изображение отображается с задержкой. Как я могу отображать изображения без каких-либо задержек? вот мой код:

JS:

 $(document).ready(function(){
        var auto = setInterval(function(){
            $("#test").load("ajax.php", {count : count}, function(){
                count = count   1;
                if (count == 5) {
                    count = 0;
                }
            }).fadeOut(100).fadeIn(100);
        },3000);
  

PHP в ajax.php:

 <?php   
    $pathArray = array( "<img src='pic/85.jpg' width='128' height='169'>",
                        "<img src='pic/18.jpg' width='128' height='169'>",
                        "<img src='pic/7.jpg' width='128' height='169'>",
                        "<img src='pic/004.jpg' width='128' height='169'>",
                        "<img src='pic/26.jpg' width='128' height='169'>"
);

    if (isset($_POST["count"])) {
        echo $pathArray[intval($_POST["count"])];
    }
?>
  

В вашем браузере должен быть путь к изображениям с автоматическим кэшированием, независимо от того, откуда поступает текст, будь то его жестко запрограммированный, java script ajax или любой другой, если вы не указали иное.

Если что-то и работает медленно, то, похоже, это ваша сеть…

Вы всегда можете создать массив javascript и сохранить путь к изображению, если оно было вызвано до использования этого подсчета.

 if (typeof images[count] != 'undefined') {
  // call ajax and save the path here, 
} else {
  //  display image
}