響應式移動旋轉的問題

Question

我正在制作該網站的移動版本www.simoneschiavo.it/occomputer

我已將media-queries.css應用於使用以下命令格式化原始CSS：

• @media屏幕和（最大寬度：770像素）風景版本

• @media屏幕和（最大寬度：400像素）用於肖像版本

如果您僅以縱向或橫向（不旋轉）加載頁面，則在每個頁面中都可以正常工作。 所以？ 好的，它在每個版本中都可以正常運行，但是當我旋轉並回來時，很混亂！

好像當我旋轉時，它需要一些關於肖像的東西，也需要一些關於風景的東西作為寬度的指標，並將其混合。 還有時重新加載頁面，它消失了，並且一切都是白色的，也等待加載。

我已經在我的個人網站www.simoneschiavo.it上使用了這種格式：您可以旋轉1000次，並且每次使用正確的媒體屏幕時都可以旋轉。 幫幫我 ：）

Answer 1

我使用以下腳本解決了問題：

<script type="text/javascript"> // RELOADS WEBPAGE WHEN MOBILE ORIENTATION CHANGES  
    window.onorientationchange = function() { 
        var orientation = window.orientation; 
            switch(orientation) { 
                case 0: window.location.reload(); 
                break; 
                case 90: window.location.reload(); 
                break; 
                case -90: window.location.reload(); 
                break; 
            } 
    };
</script>

因此，每次u旋轉時，它都會在1秒鍾內重新加載頁面，但這並不是很好。 仍在等待幫助。 謝謝