Maximize iFrame (so it appears to be the request p

2020-07-22 18:37发布

站内问答 / HTML/CSS
562 3 4

how can I (cross-browser compatible) maximize an iFrame so that it appears to be the page in the URL bar even though it is served from a different server?

标签： html css iframe
举报
3条回答
疯言疯语
2楼-- · 2020-07-22 18:55

You could set the width and height of the parent page's html and body tags to 100%, as well as the iframe tag that contains the page you want to load.

查看更多
0人赞 添加讨论(0) 举报
【Aperson】
3楼-- · 2020-07-22 19:03

I guess this ought to work:

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
 <head>
  <title>Test page!</title>
  <style type="text/css">
     html, body {
        overflow: hidden;
        margin: auto;
        height: 100%;
        width: 100%;
     }
  </style>
 </head>
 <body>
  <iframe src="page.htm" width="100%" height="100%" frameborder="0"></iframe>
 </body>
</html>

Edit 1: You could just hide the scrollbars of the page, with the HTML and scroll=no directive
(that solution should be multi-browser)

Edit 2: Now even XHTML proof ;)

Edit 3: And finally w3 validator ok
(be sure to add scroll=no in the BODY if you run in Internet Explorer compatibility problems)

查看更多
0人赞 添加讨论(0) 举报
叛逆
4楼-- · 2020-07-22 19:16

Use javascript with the event body load to set iframe height & width to window height & width.

For example in jquery :

$(document).ready(function () {
    initIframe();
});
function initIframe() {
    $("iframe").height($(window).height());
    $("iframe").width($(window).width());
}

Tested on FF, IE and GC

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)