链接到 iFrame 中的锚点

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

我需要这方面的帮助。我知道有一些类似的主题,但我找不到解决我的问题的方法。

我正在使用 Nicepage 桌面应用程序进行网页设计,其中包含一个域和一个页面(restoran---jelovnik.html),我有一个 iFrame,其中包含我在 Blogger(第二个域)(某餐厅)中创建的页面菜单)。 iFrame 是无边框的,没有滚动选项。使用 Blogger html 视图我创建了锚点:

<div id="vecera"></div>

在我的主页上,我想创建一个链接,通过将主页(restoran---jelovnik.html)滚动到该锚点,将访问者导航到该特定锚点。

我该怎么做? :(

谢谢。

P.S解释 enter image description here

我尝试通过滚动包含该 iFrame 的主页来导航到页面 iFrame 内的锚点。尝试了很多例子但没有成功。

也许这会有所帮助。

这是 ex. 的主页:

<html>
<head>
</head>
  <body>
   <a href="https://caravaggiorestoran.blogspot.com/p/caravaggio-restoran-jelovnik.html#vecera" target="restoran_jelovnik">više &gt;&gt;&gt;</a>
  
</body>
</html>

这是包含 iframe 的页面:

<html>
<head>
</head>
  <body>
  
  <iframe src="https://caravaggiorestoran.blogspot.com/p/caravaggio-restoran-jelovnik.html" style="border: 0px none rgb(255, 255, 255); height: 7137px;" name="restoran_jelovnik" onload="javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+&quot;px&quot;;}(this));" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="200px" width="100%" allowfullscreen=""></iframe>
  
</body>
</html>

当您单击主页上的链接时,它只会打开在新页面中设置为 href 的 url...但我想在我的 iFrame 内部顶部打开带有锚定文本的内容。

javascript html iframe cross-domain anchor
1个回答
0
投票

这实际上需要合理数量的 JavaScript 才能完成这项工作,我怀疑 Blogger 平台是否允许您添加实现此目的所需的代码。

如果是这样,那么我编写的库可以启用名为 iframe-resizer 的功能,该功能将通过向两个页面添加代码并拦截页面链接中的点击并在两个页面之间传输调用来实现此功能。

如果你想自己做,那么你需要在浏览器中使用 postMessage API 传递一条消息,其中包含你想要跳转到的链接以及 iframe 中的一些代码来接收该消息,计算出链接在页面,然后将消息发送回链接的 x,y 坐标的父级。收到返回的消息后,父页面需要计算出 iframe 的位置,将其添加到刚刚接收到的坐标,然后调用 JS 将页面移动到您计算出的新位置。

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