滚动到 Iframe 内网页的锚点时标题消失

问题描述 投票:0回答:1

我有一个带有标题和 iframe(外部)的网页,用于加载不同的网页作为内容。其中一个网页还有一个 iframe(内部)和侧边栏。将网页加载到内部 iframe 时,当我单击跳转到网页的特定锚点时,外部 iframe 外部的标题消失了。怎么解决这个问题?

外部 iframe 的代码

    <body>
    <header>
    <img src="image" height="100px" style="float: left; ">
    <h1><center>text</center></h1>
    <div class="navbar">
    <button class="btn" onclick="myFunction0()">Welcome</button>
      ...
    </div>  
    </header> 

    <iframe id="Myinframe" 
    width="100%"
    height="600px"
    style="border: none;"
    src="welcome.html"
    </iframe>
    </body>

侧边栏和内部 iframe 的代码:

     <body>
     <div class="container">
     <div class="sidebar">
      <ul>
        <li><a href="1.html" target="content">Text</a></li>
          ....
        <li><a href="4.html#anchor" target="content">Text</a></li> 
     </ul>
     </div>
     <div class="content">
      <iframe name="content" src="default.html"></iframe>
     </div>
     </div>
     </body>

无论我在 iframe 中进行更改,我希望标头部分保持不变。然而,虽然跳转到 1.html 有效,但当单击 4.html#anchor 时,标题将消失。

iframe anchor
1个回答
0
投票

发现页眉被滚动出去了。因此,我没有固定外部 iframe 的高度,而是使用 height: calc(100vh - 150px) 来减去标题,它就可以工作了。

© www.soinside.com 2019 - 2024. All rights reserved.