我认为对于那些了解 javascript/jquery 的人来说这是一个非常简单的问题。我对这一切都很陌生，无法做到。我发现计算导航栏偏移的代码如下所示：
var offset = 50;
$('.navbar li a').click(function(event) {
event.preventDefault();
$($(this).attr('href'))[0].scrollIntoView();
scrollBy(0, -offset);
});
这是小提琴的例子 http://jsfiddle.net/rjSfP/105/到目前为止我所拥有的。正如您所看到的，如果您单击导航栏中的链接，它只会跳到部分。在此脚本中的何处添加easing这样向下滚动会更平滑吗？
使用原始代码，我首先发现我有平滑的滚动，但新脚本丢失了。这是旧代码：
$(function() {
$('a.page-scroll').bind('click', function(event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500, 'easeInOutExpo');
event.preventDefault();
});
});
普拉沃科茨你好呀。
我在这里设置了一个工作示例Fiddle https://jsfiddle.net/uf8qty75/1/为你。
当您将此代码放置在页面中时，请将其放置在所有其他 js 脚本链接的下方。或者，如果您将其放入脚本链接中，请将链接放在末尾。
我认为您已经有了 jquery 链接。
看看这里的代码，您将看到平滑的滚动和偏移。
$(document).ready(function(){
// Add scrollspy to <body>
$('body').scrollspy({target: "#navbar"});
// Add smooth scrolling on all links inside the navbar
$("#navbar a").on('click', function(event) {
// Prevent default anchor click behavior
event.preventDefault();
// Store hash
var hash = this.hash;
// Using jQuery's animate() method to add smooth page scroll
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
$('html, body').animate({
scrollTop: $(hash).offset().top - 60
}, 800, function(){
// Add hash (#) to URL when done scrolling (default click behavior)
window.location.hash = hash;
});
});
});
注意这行代码...event.preventDefault();这用于防止第一次单击开始滚动时出现闪烁。
这部分代码将处理平滑滚动.
// Using jQuery's animate() method to add smooth page scroll
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
$('html, body').animate({
scrollTop: $(hash).offset().top - 60
}, 800, function(){
// Add hash (#) to URL when done scrolling (default click behavior)
window.location.hash = hash;
});
这有帮助吗？
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
