圖像自動重新加載淡入淡出或預加載？

Question

所以我有一個基本的系統設置爲定期重新加載網絡攝像機jpgs，但看到文件加載時很奇怪。我寧願讓其中一個褪色，或者至少等待整個圖像加載，然後再將另一個圖像替換掉。

 $(document).ready(function() { 
     setInterval('updateCamera()',1000); 
}); 

function updateCamera() { 
     $('#camera').attr('src','cam_1.jpg?'+ new Date().getTime()); 
     } 

這裏是網站，點擊「Live Feed」www.graysonearle.com/frogutopia任何想法？

Answer 1

你可以嘗試這樣的

$(document).ready(function() { 
    setTimeout('updateCamera()',1000); // Just call one time on dom ready using setTimeout() 
}); 

function updateCamera() { 
    $('#camera').attr('src','cam_1.jpg?'+ new Date().getTime()).load(function() { 
     updateCamera(); // then call updateCamera() each time after image load complete 
    }); 
}