如何重置圖像位置

Question

我正在製作一款遊戲，並且我正在嘗試創建遊戲結束功能。我將如何去重置所有圖像到他們的起始位置？

Answer 1

您可以編程式地將圖像類的所有位置存儲在數組內的Object中。 然後你可以循環array恢復他們的位置。

var positions = new Array(0); //positions array 

function objPos(obj){ 

    return({ 
     'obj':obj, 
     'x':obj.style.left, 
     'y':obj.style.top 
    }); 
} 


function savePositions(imgContainer){ 

    var imgs = imgContainer.getElementsByTagName('IMG'); 

    for(var i=0; i<imgs.length; i++){ 

     positions[i]=objPos(imgs[i]); 

    } 
} 

function restoreStoredPositions(){ 

    for(var i=0; i<positions.length; i++){ 

     var img=positions[i]; 
     img.style.top=positions[i].y; 
     img.style.left=positions[i].x; 
    } 
} 

呼叫初始狀態savePositions功能，你以後可以叫restoreStoredPositions。如果您想要持久數據，請將數組綁定到JSON，然後將其存儲到Cookie或HTML5 LocalStorage中。

我知道這是純粹的JS，但這只是我現在寫的一個概念。 你可以適應這個使用each（）和jQuery的選擇器的地方getElementBy ... 我用style.top和左只是爲了便於閱讀，computedStyles是正確的路徑。