时间戳

首页 > 解决方案 > 使用图像作为可点击的锚链接

html - 使用图像作为可点击的锚链接

问题描述

我有一个由几张图像组成的sidenav。我希望这些图像链接到同一页面上的部分 - 锚链接。但是，我似乎无法让它工作。

这是我的 HTML：

<div id="nav2"><a href="#powerlifting"><img src="img/icon1.png" alt=""></a></div>

<a name="powerlifting"></a>
<div id="powerlifting">
    <div class="header1"><h1>POWERLIFTING</h1></div>
</div>

这是#nav2 的样式：

#nav2 {
    position: fixed;
    top: 14.285vh;
    cursor: pointer;
}

提前致谢！:-)

标签： htmlcssimagehyperlinkanchor

解决方案

上面的代码似乎正在工作。href带有of的锚标签#powerlifting实际上会跳转到div#powerlifting. 你可能看不到它，因为你div可能不够高。

但是，如果您希望它通过动画向下滚动，则需要使用 JS 或 CSS。

这可能是一个相关的答案：Scrolling to an Anchor using Transition/CSS3。随附的 JS Fiddle（来自相关答案）可能对您有所帮助：http: //jsfiddle.net/YYPKM/3/

推荐阅读