2

我正在使用 jQuery Mobile 库。我正在显示一个 IFrame，如下所示：

<iframe width="100%" height="600" frameborder="0" title="Content" src="https://c.na6.content.force.com/servlet/servlet.FileDownload?file=00P8000500D26o6EAB" name="docframe" id="docframe"></iframe>

在桌面浏览器上查看 iFrame 占据了我希望的整个宽度。在 iPad 上，iFrame 似乎占据了大约 50% 的可用空间。iFrame 似乎没有包含在将其大小限制为 50% 的任何内容中（即它似乎不在网格中等......）

我应该尝试什么类型的东西让我的 iFrame 全宽？

4

1 回答 1

0

这是一个可能有帮助的替代方案：

   <head>
       <script type="text/javascript">
       function jqUpdateSize(){
            // Aspect ratio of the video's height and width. For eg: 360/480 
            var aspect_ratio = <height of the video>/<width of the video>;
            // Get the dimensions of the content div
            var width = $('#iframes-div-container').width();
            var height = width * aspect_ratio;

            $('#video-iframe').css("width",width);
            $('#video-iframe').css("height",height);
        };
        $(document).ready(jqUpdateSize);    // When the page first loads
        $(window).resize(jqUpdateSize);     // If the browser's size changes
        </script>
    </head>
    <body>
    <div data-role='page'>
     .
     .
     <your code>
     .
     .
     <div data-role="content" id="iframes-div-container">
        <center>
          <iframe id="video-iframe" src="https://c.na6.content.force.com/servlet/servlet.FileDownload?file=00P8000500D26o6EAB" frameborder="0" allowfullscreen></iframe>
        </center>
     </div> 

    </div>
    </body>

希望这可以帮助。

于 2013-11-19T18:47:46.227 回答