Link 锚定在框架中

Link to anchor in frame

我正在为一个漫画品牌建立一个作品集网站,并希望将商店整合到该网站中。该网站是用 Indexhibit 构建的,我一直在尝试多种选择。

目前我只想在每个产品的单独页面上有一个 "BUY IT NOW" link,并在锚点中打开它或在商店页面向下滚动到它.商店页面是在网站内的 iframe 中打开的 Tictail 商店。

这是个人页面: http://www.clubedoinferno.com/index.php/project/yonkoma-collection-vol1/

您可以看到 link 代码为

<a href="http://www.clubedoinferno.com/index.php/store/">BUY NOW</span></a>

商品的 DIV 名称中引入了商品在商店的锚点,因为 Tictail 启用了主题自定义:

<div id="fH9a">x</div>

使用基本的东西,比如将 #fH9a 添加到我的 link 是行不通的。请帮忙?

我认为不使用脚本就无法做到这一点。

your page in iframe中添加以下内容

<script>
window.scrollTo(0,document.getElementById(parent.window.location.hash.substring(1)).offsetTop);
</script>

下面就给大家锚点部分url

parent.window.location.hash.substring(1)

你的情况是 fH9a。然后让 window 滚动到具有该 ID 的元素。就像

window.scrollTo(0,document.getElementById("fH9a").offsetTop)

只是它是动态的,只要您在页面中有具有给定 id 的元素,它就可以与任何锚点一起使用。

this page传递带锚点的id如下

<a href="http://www.clubedoinferno.com/index.php/store#fH9a">BUY NOW</span></a>

希望有用。

编辑

iframe 中的页面似乎不是来自同一域。所以上面的方法是行不通的。

但是如果你更新

<a href="http://www.clubedoinferno.com/index.php/store#fH9a">BUY NOW</span></a>

<a href="http://www.clubedoinferno.com/index.php/store?fH9a">BUY NOW</span></a>

并使用

document.referrer.substring(1+document.referrer.indexOf("?"))

而不是

parent.window.location.hash.substring(1)

它将(希望)起作用。

普通HTML

<a href="https://tictail-shop.fi/#product1" target="shop-frame">Product1</a>

<frame src="https://tictail-shop.fi/" name="shop-frame">

ps。 js 应该遵循 html 在使用中的选定实现中的标准