如何在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(); 
    });