如何在方向更改（電話）後重新加載CSS文件？

對於我網站上的圖庫，我使用媒體查詢根據屏幕寬度重新調整圖像大小（我使用圓頂場所的folio主題），並且在您傾斜手機時圖像大小應該會發生變化 - 但這隻發生在你手動重新加載它。（添加方向橫向或縱向不起作用）。如何在方向更改（電話）後重新加載CSS文件？

所以基本上，我想避免重新加載整個頁面，因爲它涉及重新加載圖像 - 信息是在CSS文件中，我可以單獨重新加載該文件？

非常感謝！

來源

2013-05-04 user1943342

所有最近的智能手機和平板電腦瀏覽器都支持基於方向的媒體查詢，請參閱article here。這裏提到它支持iOS 4.0以上版本。如果您向下滾動獎勵：iPhone支持部分，它還爲自動觸發的手機提供瞭解決方法。

如果您指定媒體查詢作爲CSS include的一部分，它不應該加載，直到它變得適用，自動解決您的問題。

如果您仍遇到有問題的平臺，可以使用Javascript onOrientationChange event作爲回退，例如Mootools Utility/Asset可以在運行時或其jQuery對應程序中加載圖像和樣式表。

來源

2013-05-04 09:53:36

使用例如jQuery mobile和趕上orientationchange事件。

$(window).bind('orientationchange', function(e) { 
    if(e.orientation === 'landscape'){ 
     //edit you CSS 
     // or reload image 
    }else{ 
     // roll back 
    } 
});

來源

2013-05-04 09:53:42

謝謝，我該如何將它綁定到if/else語句？基本上我需要一個例外，當圖像處於全屏時重新加載（因爲當它以全屏重新加載時，你退出全屏）。或者有沒有像我可以使用的忽略功能？對不起，我是新手！ – user1943342 2013-05-04 10:54:47

如何在方向更改（電話）後重新加載CSS文件？

回答

相關問題