jQuery smooth scroll包含id的完整url
只是想知道如何使用完整的URL启用平滑滚动。
这是导航
想用
这是用于滚动到页面上的部分的jQuery代码。
function smoothScroll(duration) { $('a[href^="#"]').on('click', function (event) { var target = $($(this).attr('href')); if (target.length) { event.preventDefault(); $('html, body').animate({ scrollTop: target.offset().top }, duration); } }); }
任何帮助都会非常感谢。
据我所知,你想留在同一页面,只是出于某种原因,你希望你的内部链接是绝对的。
要实现与绝对URL的内部链接,您可以像这样更改它:
JavaScript的:
var duration = 1000; var domainname = 'http://domainname.com/'; $('a[href^="'+domainname+'#"]').on('click', function (event) { var target = $(this).attr('href'); if (target.length) { event.preventDefault(); target = $( target.replace(domainname, '') ); $('html, body').animate({ scrollTop: target.offset().top }, duration); } });
说明:您更改选择器,使其不会在“#about”和“ http://domainname.com/#about ”等url上激活。 然后你切断了域名部分,你会再次有一个像’#about’这样的内部链接。
小提琴: https : //jsfiddle.net/u5dL9rt3/