iframe中的響應內容在iPad上沒有響應

我有一個響應網站，但是當加載到iframe中時，該網站在iPad上無法響應，而在PC和Mac上運行良好。 iframe具有100％的寬度，但仍然在iPad上顯示水平滾動，同時在所有PC和Mac瀏覽器上工作。iframe中的響應內容在iPad上沒有響應

http://www.genovaperte.it/item/hostaia-del-missionario/web

來源

2014-01-21 Marco Marsala

我發現，指定固定寬度的iframe解決該問題。但是，當我把寬度= 100％，它顯示了問題。我需要可變寬度。 –

的問題是在陷害網站本身。

工作小提琴：http://jsfiddle.net/K64Mm/6/ 正在與一個「好」的迴應式網站例如：http://www.genovaperte.it/item/ristorante-zeffirino/web

</div> 
    <div class="content"> 
     <iframe scrolling="yes" src="http://www.zeffirino.com"></iframe> 
    </div> 
</div> 

html, body { width: 100%; height: 100%; overflow: hidden; margin: 0px; padding: 0px; } 

.wrapper { width: 100%; height: 100%; padding-bottom: 45px; -webkit-overflow-scrolling: touch !important; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } 
.top { height: 45px; background-color: red; } 
.content { height: 100%; width: 100%; overflow: auto !important; } 
.content iframe { display: block; border: none; width: 100%; height: 100%; }

來源

2014-01-21 09:07:51

這裏是我的解決方案>> IFRAME + jQuery和像一個魅力的工作。的jsfiddle >>http://jsfiddle.net/leowebdev/6NSX3/

<html lang="en" class="no-js"> 
    <head> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width,initial-scale=1.0"> 
     <style> 
     html body {width: 100%;height: 100%;padding: 0px;margin: 0px;overflow: hidden;font-family: arial;font-size: 10px;color: #6e6e6e;background-color: #000;} #preview-frame {width: 100%;background-color: #fff;}</style> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
     <script> 
     var calcHeight = function() { 
      $('#preview-frame').height($(window).height()); 
     } 

     $(document).ready(function() { 
      calcHeight(); 
     }); 

     $(window).resize(function() { 
      calcHeight(); 
     }).load(function() { 
      calcHeight(); 
     }); 
     </script> 
    </head> 
    <body> 
     <iframe id="preview-frame" src="http://yourwebsitehere.com/" name="preview-frame" frameborder="0" noresize="noresize"> 
     </iframe> 
    </body> 
</html>

來源

2014-08-05 21:38:44 leowebguy

iframe中的響應內容在iPad上沒有響應

回答

相關問題