0
最新のコメントhereのjQueryスニペットを使用しています。ユーザーがタブをクリックしたときの2番目のケースでこの動作を回避するにはどうすればよいですか?特定の内部リンクで滑らかなスクロールを避けるにはどうすればよいですか?
GOOD (it's working as it should):
<a href="#schedule">Schedule</a>
BAD (scrolls to the top of the page, which I dont want):
<a class="nav-link" data-toggle="tab" href="#tour" role="tab">TOUR</a>
<script>
$('a[href*="#"]:not([href="#"])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var $target = $(this.hash);
$target = $target.length ? $target : $('[name=' + this.hash.slice(1) +']');
if ($target.length) {
var baseMinScrollTime = 500,
baseMaxScrollTime = 900;
var docHeight = $(document).height(),
triggerTop = $(this).offset().top,
targetTop = $target.offset().top;
var scrollProportion = (targetTop - triggerTop)/docHeight,
relativeTime = ((baseMaxScrollTime - baseMinScrollTime) * scrollProportion) + baseMinScrollTime,
// Create inverse relationship (quicker the further we scroll)
scrollTime = -1 * (1 - relativeTime);
$('html, body').animate({
scrollTop: targetTop - 10
}, scrollTime);
return false;
}
}
});
</script>
ありがとう! #home、#one、#two、#threeの複数のリンクを渡すにはどうすればよいですか? – Jake
私の答えを更新しました。それはあなたのために今働くはずです –