开发者

Fill window with iFrame and not show scrollbars?

How can I make my iframe fill the window and not display any scrollbars?

This works for IE6, I would like to get it to work for all browsers if possible:

<iframe name=iframe1 src="theSiteToShow.html"  width="100%" height="100%" frameborder="0" marginheight="10" marginwidth="10"></iframe>
<script type="text/javascript">
function resizeIframe() {
    var height = document.documentElement.clientHeight;
    height -= document.getElementById('frame').offsetTop;

    // not sure how to get this dynamically开发者_如何转开发
    height -= 20; /* whatever you set your body bottom margin/padding to be */

    document.getElementById('frame').style.height = height +"px";

};
document.getElementById('frame').onload = resizeIframe;
window.onresize = resizeIframe;
</script>


You should be able to do this using CSS only, without any need for javascript. The following works for me in IE6+, Google Chrome and Safari:

<style type="text/css">
body {
   margin: 0;
   overflow: hidden;
}
#iframe1 {
    position:absolute;
    left: 0px;
    width: 100%;
    top: 0px;
    height: 100%;
}
</style>

<iframe id="iframe1" name="iframe1" frameborder="0"  
     src="theSiteToShow.html"></iframe>  

Your frame margins should be set in the body of theSiteToShow.html.

UPDATE
Following your comment, I used the following as a test page:

<html> 
<head>
<style type="text/css">
body {
   margin: 0;
   overflow: hidden;
}
#iframe1 {
    position:absolute;
    left: 0px;
    width: 100%;
    top: 0px;
    height: 100%;
}
</style>
</head> 
<body> 
<iframe id="iframe1" src="http://stackoverflow.com" frameborder="0"></iframe>
</body> 
</html>

Tested in IE6+, Chrome, Safari and Firefox, it works just fine and fills the entire window.


I was having the same issues with the scroll bars as well as the No Context Menu showing up, even though all these elements had been disabled. After a few days of trying to solve them, I stumbled on this post, which helped a bit, but led me onto finding a post on flexible webplayers with three code examples. Here're the links:

http://virtualplayground.d2.pl/?p=367#comment-224

Download package

Use the index file if you want a blank sheet to work from, replace your existing code in your exported .html file (from Unity export), replace the 'unityObject.embedUnity' link with your own link to your .html file located on your server.

To embed the player in your page using an iframe add:

Lock and load.

Hope this helps.

^_^

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜