1
대용량 슬라이더를 사용하고 있으며 수행 할 수없는 작업을 구현하려고합니다. 이미지를 비동기 적으로로드 할 때
I는 네 개의 이미지 a.jpg, b.jpg, c.jpg 및 d.jpg이 I 3 초,의 화상 슬라이드 간격을 말한다.
이제 b.jpg는 매우 큰 이미지이므로로드하는 데 4 초 정도 걸립니다.
이제 a.jpg가로드되어 유지 된 후 이미지는 b.jpg 이미지로 이동합니다.
슬라이더 간격이 3 초이고로드하는 데 b.jpg가 4 초가 필요하기 때문에 슬라이더가 변경되어 b.jpg가 완전히로드되기 전에 슬라이더가 변경되고 c.jpg가로드됩니다.
그래서 b.jpg 앞에 c.jpg가로드되기 때문에 b.jpg가 보이지 않습니다.
슬라이더를 다음과 같이 작동 시키려면 : 한 이미지가 총로드되지 않으면 슬라이더가 전송되지 않습니다.
b.jpg가로드되는 데 6 초가 걸리면 슬라이더가로드하는 데 6 초가 걸립니다. 완전히로드 한 후 3 초 (전환 간격) 동안 그대로 유지되고 슬라이더가 변경됩니다. 여기
내 스크립트입니다 :$(window).load(function(){
jQuery(function($){
$.supersized({
// Functionality
slide_interval : 3000, // Length between transitions
transition : 1, // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
transition_speed : 1200, // Speed of transition
// Components
slide_links : 'blank', // Individual links for each slide (Options: false, 'num', 'name', 'blank')
slides : [ // Slideshow Images
<?php
foreach($wed_image as $wi)
{?>
{image : '<?php echo base_url().$wi['wed_pic_image'];?>', title : 'Image Credit: Maria Kazvan', thumb : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/thumbs/kazvan-1.jpg', url : 'http://www.nonsensesociety.com/2011/04/maria-kazvan/'},
<?php
}?>
]
});
});
});