1
以下代碼是我正在嘗試執行的操作的總結,即開發一個允許用戶左右滾動顯示圖像的界面。圖像從屏幕開始,然後到中心,並將前一個圖像從屏幕上退出。正確高效地執行後臺加載
我很想談談我對代碼的一些建議或者關於如何更好地實現它的建議。顯然,如果用戶快速點擊箭頭,無疑會破壞腳本,所以我需要幫助。也許阻止箭頭在「加載」狀態時被點擊?
我還應該提到backgroundLoad會預載下一張和上一張圖像。當我說「屏幕外」時,它會對中心生成動畫。我不是在尋找圖庫/燈箱解決方案。這個問題更多的是關於預加載過程。
var imgArray=[];
var b = 0;
function loadImage(ini){
b = ini;
//preload image
var num_loaded = 0;
imgArray[ini] = new Array();;
for(var i=0;i<2;i++){
imgArray[ini][i] = new Image();
imgArray[ini][i].onload = function(){
num_loaded++;
if(num_loaded == 1){
}
if(num_loaded == 2){
//do something
backgroundLoad(ini+1);
}
}
imgArray[ini][i].src = ArrayOfFiles[ini][i];
}
}
function backgroundLoad(ini){
var num_loaded = 0;
imgArray[ini] = new Array();;
for(var i=0;i<2;i++){
imgArray[ini][i] = new Image();
imgArray[ini][i].onload = function(){
num_loaded++;
if(num_loaded == 2){
// loaded
}
}
imgArray[ini][i].src = ArrayOfFiles[ini][i];
}
}
$("div#arrow-left").click(function(){
loadImage(b+1);
});
$("div#arrow-right").click(function(){
loadImage(b-1);
});
檢查我的編輯。我不是在尋找一個圖庫。 – Adam