HTML 通过点击图片的一部分跳转到另一个页面的特定部分

HTML Jump to certain part of another page by clicking on a part of an image

好吧,我刚开始为学校做 HTML/CSS/PHP。我通过添加一个图像(在 Photoshop 中制作)并将其放入图像映射来制作网页。我有 2 个按钮,它们都是可点击的,需要重定向到另一个页面。我所有的网页都只包含一张图片。现在我的问题是,如何在单击其中一个按钮时跳转到另一页并到达该图像的底部(页面底部)? (如果我点击其中一个按钮,它会自动在顶部加载下一页)

希望你们中的一个能帮我解决这个问题!

编辑:

添加来自评论的图片,因为它们包含代码:

您必须在该图像下方添加一个带有 id 的元素,然后将该 id 添加到 link。

这是link:

<a href="otherpage.html#bottom">Link to image</a>

这是另一页:

<img src="img/yourimage.png" /><div id="bottom"></div>

在您的图片下方,只需添加一个 ID 为 属性 的元素,并在按钮中添加一个锚点 url。

Page1.php :

<a href="page2.php#image-bottom">Go to bottom</a>

Page2.php :

<img src="image.png" alt="image">
<span id="image-bottom"></span>

如果我对您的理解正确,您希望 link 转到特定的 向下滚动目标页面。 因此,与其加载 target.html 并位于页面顶部 你想在页面较低的地方。或者有一些较低的含量 加载时位于屏幕顶部。

在 starting_page.html 你的 link 目前看起来像这样

 <a href='target_page.html'>click here</a>

将其更改为

 <a href='target_page.html#Position_1_on_page'>click here</a>

然后编辑您的 target_page.html 并放入

 <div id='Position_1_on_page'></div>

现在,当有人点击 link 时,它将加载 target_page.html 并滚动 它向下,以便名为 Position_1_on_page 的 div 将成为最顶层的元素 加载后在页面上