手機視圖模擬器，Javascript/HTML

-1

我想「模擬」網站在手機中的顯示方式。所以，例如下面的代碼：手機視圖模擬器，Javascript/HTML

<div> 
    <div class = "col-md-6 col-sm-6 col-xs-12"> 
     First 
    </div> 
    <div class = "col-md-6 col-sm-6 col-xs-12"> 
     Second 
    </div> 
</div>

必須始終看在XS-12版本的網站。我試圖使用<meta id="viewport" name=viewport content="width=200px; initial-scale=1">，但它不適合我。

來源

2015-04-24 mondayguy

我需要通過單擊按鈕（例如）向用戶顯示站點的移動視圖。 – mondayguy

您可以使用谷歌Chrome瀏覽器開發工具和模擬移動體驗：https://developer.chrome.com/devtools/docs/device-mode它可以幫助你模仿不僅是用戶代理，但地理位置和其他設備的東西

來源

2015-04-24 20:22:23 darthega

我在上面添加註釋：「我需要通過單擊按鈕（例如）向用戶顯示站點的移動視圖。」 – mondayguy

嗯...這將具有與複製同樣的效果您的瀏覽器的分辨率爲，例如。 Resizer（移動探險）或使用它的網站iPadPeek

您的瀏覽器不會閱讀<meta>視口信息。在這種情況下，您將無法獲得完整的移動「視圖」或體驗。

如果您試圖在實際的移動設備上執行此操作（不會是模擬器）;它不起作用，你需要顯示相關的CSS樣式。元視口聲明與CSS3媒體查詢一起工作。

現在，如果你想創建一個按鈕來打開一個移動大小的新窗口..你可以做到以下幾點。

<button onclick="myFunction()">Try it</button> 

<script> 
function myFunction() { 
    var myWindow = window.open("", "", "width=320, height=460"); 
} 
</script>

但是，這不會是一個完整的移動複製..只有一個類似的決議彈出。

來源

2015-04-24 20:35:05

如何在當前頁面中執行操作？ – mondayguy

你必須開始提出新的問題，男人！ –

這不是新的問題，也許我可憐的英語不能讓我解釋清楚，我沒有從這2個答案中得到新的答案=（ – mondayguy

手機視圖模擬器，Javascript/HTML

回答

相關問題