我正在使用的网站存在问题-主要是我似乎无法以占据整个页面的方式将HTML文档放入iframe。我也使用angular获取src是html文件。这是页面现在的样子:

1)https://gyazo.com/f5cb06ede5fc0b6da99f49dfd8e32d5f
2)https://gyazo.com/c9ad51e9bfaa12fedc4e1c2dbcbb7b42

请注意,这里有一个滚动条,这是我的问题。如何摆脱滚动条并显示网页内容,使其完全扩展而无需滚动条?这是我的代码供参考:



 <iframe id="content" [src] = "recipeHTML | safe">

 </iframe>

      <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
      <script type='text/javascript'>

    $(function(){

        var iFrames = $('iframe');

        function iResize() {

            for (var i = 0, j = iFrames.length; i < j; i++) {
            iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
            }

            if ($.browser.safari || $.browser.opera) {

            iFrames.load(function(){
                setTimeout(iResize, 0);
            });

            for (var i = 0, j = iFrames.length; i < j; i++) {
                    var iSource = iFrames[i].src;
                    iFrames[i].src = '';
                    iFrames[i].src = iSource;
            }

            } else {
            iFrames.load(function() {
                this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
            });
            }

        });

</script>


非常感谢

最佳答案

您可以看几件事。首先,在CSS文档中,包括以下内容应消除iframe中滚动条的外观;

iframe{
overflow:hidden;}


但是,从现在开始,我一直在做一些猜测,因为您并未真正了解源WRT的编码方式-您可以尝试通过限制源页面的大小来限制源页面的大小一个具有指定大小的div,这样,通过iframe调用页面时,您可以使用代码的width =“” height =“”属性(或将其包括在标签中)明确地告诉iframe具有相同的高度和宽度。 CSS)。

关于javascript - 无法在iframe中容纳整个HTML内容,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51601359/

10-10 18:21
查看更多