2015-12-06 122 views
-2

嗨我有一個響應式設計的網站嵌入到另一個網站。但問題在於,在移動設備和平板電腦上,嵌入式網站不斷響應設備窗口大小。代碼如下。預先感謝您的幫助。如何在網站中嵌入響應式網站而不會丟失網站設計響應?

<!DOCTYPE html> 
<html> 
<header> 

<script src="http://code.jquery.com/jquery-latest.min.js" 
     type="text/javascript"></script> 
<style> 
html, body { 
    height: 100%; 
} 

div { 
    height: 99%; 
} 

object { 
    width: 100%; 
    min-height: 100%; 
}  
</style> 

<script> 

$(document).ready(function() { 

    $("#siteloader").html('<object data="www.responsivesite.com" />'); 

}); 
</script> 


</header> 



<body> 

<div id="siteloader"></div> 








</body> 






</html> 

回答

0

使用iframe嵌入其他頁面。媒體查詢將根據iframe的寬度進行處理。例如,

窗口寬度 - 480像素
iframe的寬度 - 100%
@media(最大寬度:480像素)將觸發。

窗口寬度 - 480像素
iframe的寬度 - 80%
@media(最大寬度:480像素)將不觸發。

0

把這個在HTML

<meta name=viewport content="width=device-width, initial-scale=1"> 

的頭