如何在HTML頁面上顯示相同的座標時，它是全屏幕，當它不是全屏？

Question

我有一個html頁面，我將圖像放在相對於它們所在的窗口的特定x和y座標上，但是當我點擊我的全屏按鈕使頁面全屏時，圖像稍微偏離我希望他們成爲的座標。有什麼辦法可以在切換全屏時獲得相同的座標？

    function toggleFullScreen() { 
        var doc = window.document; 
        var docEl = doc.documentElement; 
        var requestFullScreen = docEl.requestFullscreen || docEl.mozRequestFullScreen || docEl.webkitRequestFullScreen || docEl.msRequestFullscreen; 
        var cancelFullScreen = doc.exitFullscreen || doc.mozCancelFullScreen || doc.webkitExitFullscreen || doc.msExitFullscreen; 

        if (!doc.fullscreenElement && !doc.mozFullScreenElement && !doc.webkitFullscreenElement && !doc.msFullscreenElement) { 
         requestFullScreen.call(docEl); 
         var load = document.getElementById('<%=alreadyLoaded.ClientID%>'); 
         load.value = 2; 
        } 
        else { 
         cancelFullScreen.call(doc); 
         var load = document.getElementById('<%=alreadyLoaded.ClientID%>'); 
         load.value = 2; 
        } 
       } 

Answer 1

用這種方法，您將能夠調用toggleFullScreen（）;每次屏幕更改大小，我沒有測試代碼，你可以測試它，並給我一些反饋

window.addEventListener('resize', function(event) { 
     toggleFullScreen(); 
    });