对 div 的 id 使用 href答案

【问题标题】：Using href to an id of a div对 div 的 id 使用 href
【发布时间】：2018-05-23 05:02:34
【问题描述】：

我正在尝试使用 href 将我带到一个特定的 div，其 id 对应于 a href="#1"> 中的内容。

例如，我有以下三个 div。

<ul>
<li id="1" class="cd-single-item cd-active">
    <div class="cd-caption two-third-width">
	    <h2>1.</h2>
		<div style="height: 100px">
		</div>
	</div>
</li>
<li id="2" class="cd-single-item cd-not-visible cd-move-right">
	<div class="cd-caption two-third-width">
	     <h2>2.</h2>
		<div style="height: 100px">
		</div>
	</div>
</li>
<li id="3" class="cd-single-item cd-not-visible cd-move-right">
	<div class="cd-caption two-third-width">
	     <h2>3.</h2>
		<div style="height: 100px">
		</div>
	</div>
</li>
</ul>

当我的网站处于移动模式时，href 会正确转到相应的列表项。但是，在普通桌面模式下，它不会。

这里有一个网站链接。 https://what-is-wrong-with-this-css.herokuapp.com/

链接应该来自左上角的菜单图标。看看它如何正确地进入移动设备中的列表项，而不是桌面。有谁知道这里有什么快速修复方法。

谢谢，

【问题讨论】：

您需要在此处发布足够的代码，以便我们能够重新创建您的问题。请不要指望我们会去您的网站并倾注源代码。另外，最好不要以数字开头id。
嗨，斯科特，如果我提供一个实际示例供人们查看，这将是最简单的。也通常不会以数字开头 id，但这只是为了演示。
@SwimmingG Stack Snippet 功能允许您在此处提供示例。
最好发布示例，但您可以在 SO 中这样做，这是最好的，因为如果您的 what-is-wrong-with-this-css.herokuapp.com 链接损坏，这个问题将没有任何意义。请记住，SO 不只是让您回答您的问题，它还是未来可能会发现此问题的其他人的知识库。

标签： javascript jquery html css

【解决方案1】：

它适用于移动设备，因为您正在上下滚动页面。在您的桌面版本中，您使用 javascript 来处理左右移动，而不是菜单链接。

对元素 ID 使用 href 是为了滚动 afaik。如果你想将它用于这种水平设置，你需要像这样监听 window.hashchange 事件：

window.addEventListener("hashchange", funcRef, false);

并根据新的哈希值触发滚动。

【讨论】：