使用javascript設置屏幕方向，寬度和高度

是否可以手動設置動態生成的iframe的屏幕屬性？想要設置方向，寬度和高度以模擬該iframe的「移動」視圖？使用javascript設置屏幕方向，寬度和高度

我已經創建了兩個單獨的小提琴：

父：https://jsfiddle.net/mooioom/69240vec/

「設備」：https://jsfiddle.net/mooioom/19tsk4L8/

母體是開放指向「設備」的iframe與iphone分辨率尺寸375x667
「設備」具有媒體查詢以匹配iphone分辨率，以及應該將按鈕顏色從綠色更改爲黃色，如果檢測不到，可能是因爲檢測到的screen.width和screen.height尺寸。

所以我怎樣才能設置screen.width和「設備」在從父創建時間的screen.height。

---更新---

所以像Gezzasa說，如果媒體查詢min-device-width更改爲min-width它的工作原理，但爲了得到一個完整的解決方案，我仍想知道如何使iframe「相信」它在移動設備中運行，我已經閱讀過一篇文章，它涉及到修改頭文件和用戶代理，因爲一些響應技術的目標是用戶代理檢查它的移動設備。

是拋開，問題仍然有效，如何動態地設置screen.width和screen.height（和方向）在iframe，從父窗口

來源

2017-01-25 levi

您是否可以編輯iframe的內容？想想在特定頁面上進行簡單的媒體查詢就可以實現。 – Gezzasa

我可以編輯內容，並在iframe中使用移動媒體查詢。哪些尺寸設置爲適合移動像素尺寸，問題是iframe中的screen.width「screen.height」。正在反映我正在使用的真實屏幕，這是一個桌面...似乎CSS媒體查詢是針對這些屬性，而不是iframe的寬度和高度。 – levi

我可能會理解錯誤。這個示例http://www.w3schools.com/tags/tag_iframe.asp將創建iframe。寬度和高度很小（默認情況下），並顯示www.w3schools.com的移動版本，因爲w3schools上託管的媒體查詢就是這樣。您的媒體是否在正確的域名上進行查詢，並且您是否爲媒體查詢下的iframe設置了寬度和高度？如果沒有，恐怕我不能幫助你，除非你能夠在jsfiddle中重新創建它。 – Gezzasa

查詢的問題是，iframe不從設備加載，因此「min-device-width」將不起作用，因爲它不是設備。如果您將其更改爲「最小寬度」和「最大寬度」，則應該使用該設備。

來源

2017-01-25 09:56:57 Gezzasa

希望這可以幫助你

var view=document.getElementById("view"); 
 

 
var ifrm = document.createElement('iframe'); 
 
ifrm.setAttribute('id', 'ifrm'); 
 
view.appendChild(ifrm); 
 
var ifrmId=document.getElementById("ifrm"); 
 
ifrmId.style.width="200px"; 
 
ifrmId.style.height="200px";

<div id="view"> 
 

 
</div>

來源

2017-01-25 08:11:02

謝謝！但這實際上是我已經做的事情。我的問題不是iframe的物理尺寸，iframe.document等是iframe.screen對象，媒體查詢是（我認爲）針對... – levi

使用javascript設置屏幕方向，寬度和高度

回答

相關問題