我创建了一个漂亮的小 JavaScript 菜单,它故意不使用数据标签,因为我遇到了 html 净化器冲突(另一个长话短说)。
无论如何,经过大量修改,功能和样式完全按照我想要的方式工作,但有一个异常(exception) - 当我单击每个菜单项时,它会在屏幕上的不同位置打开内容,似乎取决于内容的数量内容。我希望它始终在顶部打开,以便菜单以及内容顶部始终可见,然后您可以根据需要向下滚动。
我已经尝试解决这个问题有一段时间了,所以希望得到任何帮助,或者修改所附的 fiddle 。
提前致谢
保罗
https://jsfiddle.net/awcguxs5/
$(document).ready(function () {
var lastItem = null;
$('#listingmenu').on('click', 'a', function () {
newItem = this.getAttribute('href').substring(1);
if (newItem != lastItem) {
$('.current').not($(this).closest('li').addClass('current')).removeClass('current');
// fade out all open subcontents
$('.pbox:visible').hide(600);
// fade in new selected subcontent
$('#' + newItem).show(600);
lastItem = newItem;
}
}).find('a:first').click();
});
最佳答案
问题是引用仍然指向相应的 ID 位置。我添加了一行 jquery,单击后会将页面滚动回顶部。这是添加的行:
$("html, body").animate({ scrollTop: 0 }, 1);
这是您的 jsfiddle 与此行:
https://jsfiddle.net/awcguxs5/2/
请告诉我这是否是您正在寻找的内容! :)
关于Javascript 菜单 - 滚动/内容跳跃,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32762071/