響應式設計+ RESS技術

我想知道如果類似這樣的東西可以很容易做到的if/else PHP或JavaScript。我已經閱讀了通常的雷斯技術，我正在努力尋找一種不依賴於WURFL等設備檢測的解決方案。 也許我在找什麼叫做「條件加載」？響應式設計+ RESS技術

我的目標是基於屏幕寬度完全像一個媒體查詢只加載適當的標記。例如，我可以爲較大的屏幕創建完整的導航，併爲較小的設備/屏幕創建簡單的移動友好導航。這將節省大量的帶寬，並使網站真正靈活。感謝您的輸入！

{ if < 768 } 
some code here {html, php, etc} 
{/if} 
{ if > 768 } 
some code here {html, php, etc} 
{/if}

來源

2013-07-28 Travis Hedrick

使用在溶液中的[隱藏div元素時屏幕尺寸小於一個特定的尺寸小（http://stackoverflow.com/questions/13476267/hide-div-element-when-screen-size-is-smaller-高於一特定尺寸）。使用JS或特別是PHP解決方案將會是一個不準確的混亂。像Bootstrap這樣的框架也爲此提供了功能，比如摺疊的導航欄，以及類似「隱藏桌面」和「可見平板」的類 – FakeRainBrigand

可以使用element.clientWidth針對設備寬度和window.screen.width。另一種方法是window.matchMedia，相當於每個瀏覽器都可用。

來源

2013-07-28 07:37:48

有跡象表明，這些設計可以由幾種方法。 Javascript和PHP都可以使用，但會有他們的問題。

你說，你不想做的用戶代理檢驗，使排除了PHP。您可以使用php通過執行$_SERVER['HTTP_USER_AGENT']並測試iPhone等來檢查用戶代理，如果您想要，然後在條件語句中顯示您想要的內容。

的Javascript可以通過使用

window.screen.availWidth AND window.availHeight

這將返回可用的高度，可以通過Web瀏覽器所佔用的瀏覽器來測試屏幕尺寸。對於全分辨率使用window.screen.width AND window.screen.height

這適用於大多數瀏覽器，但配備一個問題。根據像素深度比率的不同，您可能無法返回ACTUAL屏幕分辨率。例如，我使用具有視網膜屏幕的mac。上面列出的javascript顯示我的屏幕寬度和高度是1280x800，實際上它的2560x1600或2倍的返回值。您可以通過測試視網膜屏幕的蘋果產品並將其乘以2來修復此問題。也就是說，他的像素深度不會影響網站上的對象的比例，它只是使不是hidpi的圖像和視頻看起來模糊或像素化。

希望這會有所幫助。

來源

2013-07-28 07:42:02 tiantang

響應式設計+ RESS技術

回答

相關問題