Итак, у меня есть простой слайд-шоу на моем веб-сайте, который показывает только одно изображение, затем показывает другое, пока не дойдет до конца или пока пользователь не нажмет «Пропустить», в этом случае он отобразит index.html. Сайт обслуживается на apache2 с Django. Слайд-шоу прекрасно работает на большинстве машин, но на некоторых машинах некоторые изображения показываются дважды, а другие нет вовсе, а время выключено. Я использую jquery 1.4.3.
Ниже приведен раздел html, куда я помещаю URL-адреса изображений из базы данных в javascript
{% for image in latest_images %}
{% thumbnail image.image_file "800x600" crop="center" as im %}
<script>FadeImageList.push("{{im.url}}");</script>
{% endthumbnail %}
{% endfor %}
Ниже приведен полный файл JavaScript
var FadeImageList = [];
var fadeDuration = 2000;
var fadeImgID = '#slideShow';
var homePageID = '#homePage';
var menuID = '#menu';
var skipFlag = 0;
$(document).ready(function(){
$(homePageID).fadeOut(50);
PlaySlideshow(FadeImageList);
});
var PlaySlideshow = function(FadeImageList){
var newImgSrc = FadeImageList.shift();
$('#skip').click(function(){$('#loader').show();skipFlag = 1;});
if(((typeof(newImgSrc) !== "string") || (skipFlag === 1))){
EndSlideShow();
return;
}
else{
$(fadeImgID).fadeOut(fadeDuration,function(){
$(fadeImgID).attr('src', newImgSrc);
$(fadeImgID).fadeIn(fadeDuration,function(){
PlaySlideshow(FadeImageList);
});
});
}
};
var EndSlideShow = function(fadeSettings){
$(fadeImgID).fadeOut(400,function(){
$(homePageID).fadeIn(400);
$("#skip").fadeOut(400);
$('#loader').hide();
});
};
Странно то, что у меня это работало и не работало в браузерах с одинаковыми номерами версий на одной ОС, но на разных машинах. Он постоянно работает или не работает на компьютере.
У меня был сбой в т.е. 7,8 Firefox 3.6.3 и Chrome. Я также добился успеха в ie6,7,8 Firefox 3.6.3,3.4.2,3.1 и Chrome.