我一直在研究这个问题。该脚本确实有效,所有浏览器都遵循流程。 Chrome和Safari显示幻灯片正常。我试图将间隔减慢到1秒以上,分离功能,缩短图像数量,将css更改为相对/绝对,以及众多版本的代码。我已在所有部分中发出警报以检查流程。
测试链接:http://jawilliams.site11.com/ESG/
<div id="flashHeader"> </div>
<script>
var currentItem = 0;
var itemInterval = 33;
var numberOfItems = 660;
var imagePath = "JPEG_SEQUENCE/web_4/";
var holder = $('#flashHeader');
var flashImages = new Array("MASTER_00000.jpg", "MASTER_00001.jpg", "MASTER_00002.jpg", "MASTER_00003.jpg", "MASTER_00004.jpg", "MASTER_00005.jpg", "MASTER_00006.jpg", "MASTER_00007.jpg", "MASTER_00008.jpg", "MASTER_00009.jpg", "MASTER_00010.jpg", "MASTER_00011.jpg", "MASTER_00012.jpg", "MASTER_00013.jpg", "MASTER_00014.jpg", "MASTER_00015.jpg", "MASTER_00016.jpg", "MASTER_00017.jpg", "MASTER_00018.jpg", "MASTER_00019.jpg", "MASTER_00020.jpg", "MASTER_00021.jpg", "MASTER_00022.jpg", "MASTER_00023.jpg", "MASTER_00024.jpg", "MASTER_00025.jpg", "MASTER_00026.jpg", "MASTER_00027.jpg", "MASTER_00028.jpg", "MASTER_00029.jpg", "MASTER_00030.jpg", "MASTER_00031.jpg", "MASTER_00032.jpg", "MASTER_00033.jpg", "MASTER_00034.jpg", "MASTER_00035.jpg");
function outputPlayerversion() {
var playerVersion = swfobject.getFlashPlayerVersion();
if(playerVersion.major>=19) return false;
else return true;
}
var flashLoop = {
loop: function() {
holder.removeClass('loading');
var srcImg = '';
var oldImage = 0;
var firstItem = true;
var elem = $('#flashHeader > img');
var infiniteLoop = setInterval(function() {
if(currentItem === 0) oldImage = numberOfItems-1;
else oldImage = currentItem-1;
if(firstItem) firstItem = false;
else $(elem[oldImage]).css({display: 'none !important', visibility: 'hidden !important'});
$(elem[currentItem]).css({display: 'block !important', visibility: 'visible !important'});
if(currentItem === numberOfItems-1) currentItem = 0;
else currentItem++;
}, itemInterval);
},
preloadImages: function() {
$('#flashHeader').addClass('loading');
var srcImg = '';
var count = 0;
$(flashImages).each(function() {
srcImg = imagePath + this;
var flashImg = $(document.createElement('img'));
var idTag = 'flashLoopImages' + count;
flashImg.attr('id', idTag);
flashImg.attr('src', srcImg);
flashImg.css({display: 'none'});
holder.append(flashImg);
count++;
});
this.loop();
}
};
$(document).ready(function() {
var noFlash = outputPlayerversion();
if(noFlash) flashLoop.preloadImages();
else swfobject.embedSWF("ELITE_MASTER.swf", "flashHeader", "960", "300", "9.0.0");
});
</script>
body {position:relative;}
#flashHeader {background:url('JPEG_SEQUENCE/web_3/MASTER_00102.jpg') center center no-repeat;width:960px;height:300px;position:relative;}
#flashHeader.loading {background:url('loading.gif') no-repeat center center;}
#flashHeader IMG {position:absolute;top:0;left:0;width:960px;height:300px;z-index:8;}
答案 0 :(得分:0)
我找到了问题的所在。我用以下内容更新了两行:
else $(elem[oldImage]).hide().css({display: 'none !important', visibility: 'hidden !important'});
$(elem[currentItem]).show().css({display: 'block !important', visibility: 'visible !important'});