Question

我希望将html网页的内容显示在另一个（父）html网页中，将嵌入的网页拉伸到父网页的宽度，同时删除嵌入式网页的滚动条，同时向下滚动使用主页面滚动条的嵌入式网页的内容，因为嵌入内容的高度太长而不适合。我尝试使用代码来回答类似的问题，包括：

    <iframe style='overflow:hidden; width:100%; height:100%' scrolling = "no" src="annotated list of courses.html" frameborder="0" width="100%" height="100%"> </iframe>

但我无法达到预期的效果。我希望能够使用父页面的滚动条滚动嵌入式网页的内容。有可能（不需要将代码从嵌入式HTML复制到父代的代码中）以及如何实现？感谢。

Answer 1

我通过指定嵌入式网页的特定高度来解决问题，该高度大于或等于网页的高度，如下所示：

function checkforgot($token, $id)
{
    $qry = $this->db->query("SELECT * FROM forgetpasswordtoken WHERE TokenNumber = '".$token."' AND UserID = $id");
    $num_row = $qry->num_rows();
    if($num_row!=0)
    {
        $del = $this->db->delete('forgetpasswordtoken', array('TokenNumber' => $token, 'UserID' => $id)); 
        return true;
    }
    else
    {
        return false;
    }
}

我希望这也可以解决其他问题，任何更好或不同的解决方案也值得赞赏。

ps：您必须指定一个高度至少等于嵌入网页或元素内容的高度，以使滚动条消失。

Answer 2

我已经通过使用两个DIV（一个在另一个内部）解决了这个问题。

<div style="overflow-y: hidden; border: 2px solid black; width: 300px; height: 300px; position:absolute; left: 100px; top: 100px">
    <div style="margin-top: -100px; width: 300px; height: 400px">
        <iframe scrolling="no" style='pointer-events: none; width:100%; height: 100%' src="https://earth.nullschool.net/#current/wind/surface/level/orthographic=-325.19,32.21,3000/loc=35.073,31.923" frameborder="0" type="text/html"></iframe>
    </div> 
</div>

我通过设置 scrolling =“ no”
禁用了滚动条我通过设置 style ='pointer-events：none;'

来困扰用户点击

这是一个有效的示例-https://jsfiddle.net/q46L1ynv/

在另一个网页中嵌入一个html网页，并使用父级scollbar

2 个答案: