Проблема с прелоадом картинок (слайд-шоу)
Подскажите, пожалуйста. Столкнулся с проблемой... Во всех браузерах прелоад работает нормально, кроме IE6:
Вот код:
<html>
<head>
<script type='text/javascript' src='jquery-1.4.1.min.js'></script>
<?
$prev_dir="img";
$img_dir="img";
// Reading directory and forming javascript Array
$files=scandir($prev_dir);
for ($i=2; $i<count($files); $i++)
$ArrayJavascript.="\"$prev_dir/$files[$i]\",";
$ArrayJavascript=substr($ArrayJavascript,0,strlen($ArrayJavascript)-1);
// Preloading Images JavaScript
echo " <script type='text/javascript'>
var ImgArray = Array($ArrayJavascript);
var img = Array();
for (i=0;i<ImgArray.length; i++){
img[i] = new Image();
img[i].src = ImgArray[i];
}
</script>";
?>
<script type='text/javascript'>
$(window).load(function(){
var counter = 1;
$("#img_container").width($("#SlideShow").width());
$("#img_container").height($("#SlideShow").height());
setInterval(function(){
$("#img_container").css({'background-image' : 'url('+$("#SlideShow").attr("src")+')'});
var src=img[counter % img.length].src;
$("#SlideShow").hide().attr("src",src).fadeIn(3000);
counter++;
},5000);
});
</script>
</head>
<body>
<?echo "<center><div id='img_container'><img id='SlideShow' src='$prev_dir/$files[2]' alt='SlideShow' /></div></center>";?>
</body>
</html>
Посмотреть то, что должно "фунциклировать" можно здесь: http://www.invis.emaxihost.com/galery/ Уже пол-интернета перерыл в поисках решения, но все равно не могу его найти. Все равно в процессе смены картинок в нижнем левом углу в IE6 появляется "Загрузка картинки с...." :cray: |
Не стал вникать в проблемы вашего кода, но недавно писал подобную галерею. Вот, может пригодится.
<div id="cont_galery" style="position:relative;"> <img src="/front_img/2.jpg" alt="" style="display:none; position:absolute;" /> <img src="/front_img/3.jpg" alt="" style="display:none; position:absolute;" /> <img src="/front_img/4.jpg" alt="" style="display:none; position:absolute;" /> <img src="/front_img/5.jpg" alt="" style="display:none; position:absolute;" /> <img src="/front_img/1.jpg" alt="" style="position:absolute;" /> </div>
$(document).ready(function(){
arimg = [];
arimg = $('#cont_galery').find('img');
imcount = arimg.length;
$.each(arimg, function(i){
arimg[i]=$(this);
});
$('#cont_galery').find('img:not(:last)').hide();
setInterval(slideshow,4100);
i=imcount;
function slideshow(){
if(i<(imcount-1)){i++}
else {i=0}
if(i==0) j=imcount-1;
else j=i-1;
arimg[i].fadeIn(1500);
arimg[j].fadeOut(1500);
}
});
|
Оригинально... Прелоад организован за счет размещения всех картинок со свойством "display:none". Надо будет попробовать.
А что означает position:absolute без указания координат top и left? И еще, подскажите, пожалуйста, проблем с картинками разного разрешения не было? |
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
Проверил - Опера вообще не определяет эти свойства, если не заданы. DragonFly показал что-то типа left: ; top: ; А вот FireBug выставил их равными 0, IE просчитал свойства как auto; Кстати, никто не в курсе, эти 2 свойства (left и top) обрабатываются IE нормально? Т.к. с padding - просто ппц был, когда столкнулся ;( |
| Часовой пояс GMT +3, время: 22:30. |