我用<div>
包裹了所有内容,其高度和宽度均为100px。此<div>
内的内容包含索引和内容。
问题是,点击以下代码中的“a2”不会让我跳转到谷歌浏览器的底部内容。
<div style="height:100px;width:100px;overflow:scroll;">
<ul>
<li><a href="#a1">a1</a></li>
<li><a href="#a2">a2</a></li>
</ul>
<h2 id="a1">a1</h2>
a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>
<h2 id="a1">a2</h2>
a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>
</div>
可以从以下链接查看工作代码。 http://jsfiddle.net/L7rQ6/
是否有一些很好的解决方案可以让“a2”跳转到正确的内容?
答案 0 :(得分:2)
答案 1 :(得分:2)
您错过了更新第二个<h2>
元素集id="a2"
而不是id="a1"
更新这个小,
<h2 id="a2">a2</h2>
<div style="height:100px;width:100px;overflow:scroll;">
<ul>
<li><a href="#a1">a1</a></li>
<li><a href="#a2">a2</a></li>
</ul>
<h2 id="a1">a1</h2>
a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>
<h2 id="a2">a2</h2>
a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>
</div>
答案 2 :(得分:1)
正如Felix和user1153551所说,你已经复制了两个标签的Id,试试这个。
<div style="height:100px;width:100px;overflow:scroll;">
<ul>
<li><a href="#a1">a1</a></li>
<li><a href="#a2">a2</a></li>
</ul>
<h2 id="a1">a1</h2>
a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>a1<br/>
<h2 id="a2">a2</h2>
a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>a2<br/>
</div>