我知道我在这里还很新，但是我有一个静态图像（Google Map，但尚未使用Google API），在其中创建了热点，这些热点将提取位于左侧表格中的位置数据地图。但是，当单击热点时，页面向下滚动，即使信息直接在地图旁边，地图的顶部（图像地图）也位于屏幕的顶部。
我假设这是因为锚点正试图加载到屏幕顶部。可以，除了我的标题现在被推出屏幕之外。单击热点时，页面是否可以不“移动”？
不是使用默认的浏览器行为（用于锚标记），而是将其阻止，然后自己滚动该框。我可以看到您已经在使用jQuery。因此，类似这样的事情应该可以解决。
$('area').bind('click', function(e) {
e.preventDefault();
// the div in question has nothing uniquely identifiable as it is now,
// assign it a unqie class or id so you can select it
var findAnchor=this.href.split('#')[1];
$('#the_div').scrollTop($('a[name="' + findAnchor+'"]').next().position().top);
});
很难在该页面的上下文中进行测试，但是如果您只用它的那一部分设置了小提琴，我相信可以很容易地使它正常工作。
（（edit）-OP设置了这个问题的小提琴，在这里更新版本：
上面的代码已更新，以反映实际的工作方式。我还向位置表周围的div中添加了id“ the_div”。它是这样工作的：
1）在＃之后获取href的一部分-浏览器可能会添加完整的URL。2）找到它，然后获取next()元素，因为不可见的锚标签将报告它们没有位置信息3）然后获得position().top值，该值是该元素相对于其容器的位置4）然后scrollTop(..)
与@colinross的建议相反，对于图像映射而言，没有任何东西既不可扩展也不可弯曲。恰恰相反，它们是您可以拥有形状不规则的热点而不会造成很多麻烦的唯一方法，并且可以给您带来很大的力量。要使他们做任何想要做的事情，就是将您自己的鼠标悬停和/或单击事件绑定到这些区域，然后调用e.preventDefault()。这是您的全部。
[是，我喜欢图像映射，并且我还写了一个plugin，它对它们做了很多工作。所以我颇有偏见。但是当人们死了时，为了避免它们（例如绝对定位锚链接，复杂的css等）而去麻烦，我感到惊讶，因为它们简直简单易用，可以在阳光下使用每个浏览器，并且比手动定位所有热点功能强大得多。 （并且没有图像映射表，也没有一些疯狂的逻辑来找出鼠标的位置，无论如何，您都只能使用矩形区域！）]
发生跳跃是因为您使用的图像地图正在处理对位置#DillonLocationsMap的单击。
当您单击链接时，与所述城市有关的<a name="Nashville"></a>标签最终滚动到<!-- table containing locations -->的顶部。