Question

这是我正在处理的网页。

http://www.solved.com 我想要的是当我点击“状态”Ex：CA我希望页面向下滑动并显示结果。现在它显示了结果，但它没有下滑。

Answer 1

使用a name（或id）和哈希标记（有关名称，请参阅http://www.w3schools.com/tags/att_a_name.asp）

例如，加州的链接是

<a href="#california">(image)</a>

，该部分有

<a name="california">California</a>

（或者最好）

<a id="california">California</a>

（编辑：这是使用内置浏览器功能轻松实现的方法。如果你想使用jquery来制作流畅的幻灯片，看起来像是this may be a good script来调查）

Answer 2

更改状态链接

<a href="#" id="AK">AK</a>
<a href="#" id="AL">AL</a>

到

<a href="#can_map" id="AK">AK</a>
<a href="#can_map" id="AL">AL</a>

如果您不喜欢立即滚动，请查看https://github.com/kswedberg/jquery-smooth-scroll或其他平滑滚动插件。

Answer 3

你也可以添加一个很好的平滑滚动效果，如下所示：在您的链接中添加一个类：

<a href="#can_map" class="anchor_class">Click me</a>

然后使用jquery，您可以在click事件处理程序中添加以下内容：

$('.anchor_class').click(function(){ 
    href = $(this).attr("href");
    $('html,body').animate({scrollTop: $(href).offset().top};
    return false;
});

点击链接后如何下滑？

3 个答案: