動作しない私は、ブートストラップ3.3.7で正常に動作し、私のナビゲーションバーで、バック・ツー・トップリンクを持っていなく、ブートストラップで4ベータ2ブートストラップバック・ツー・トップ4のベータ2が
バックツートップJSウェブアプリケーションのファイル
$(document).ready(function(){
var offset = 100;
var duration = 800;
$(window).scroll(function() {
if ($(this).scrollTop() > offset) {
$('#back-to-top').fadeIn(duration);
} else {
$('#back-to-top').fadeOut(duration);
}
});
// scroll body to 0px on click
$('#back-to-top').click(function (event) {
event.preventDefault();
$('#back-to-top').tooltip('hide');
$('body,html').animate({
scrollTop: 0
}, duration);
return false;
});
$('#back-to-top').tooltip('show');
});
HTMLコード
<body id="page-top" data-spy="scroll" data-target=".fixed-top">
<div id="main-navbar" class="navbar fixed-top navbar-expand-md navbar-custom navbar-dark" role="navigation" >
<div class="navbar-header">
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navbar-main-collapse">
<span class="sr-only">Toggle navigation</span>Menu
<i class="navbar-icon fa fa-bars icon"></i>
<!--<span class="navbar-toggler-icon"></span>-->
</button>
<a href="#" id="menu-toggler" class="navbar-brand"> <i class="fa fa-bars"></i></a>
<a href="#" class="navbar-brand page-scroll" id="back-to-top">Funeral Aftercare Service</a>
</div>
<div class="collapse navbar-collapse" id="navbar-main-collapse">
<ul class="nav navbar-nav">
<li class="d-none"><a href="#page-top"></a></li>
<li class="nav-item">
<a class="<?php echo $index; ?>" href="index.php">
<span class="fa fa-home"></span> Home <span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item"><a class="<?php echo $about; ?>" href="about_us.php">About Us</a></li>
<li class="nav-item"><a class="<?php echo $contact; ?>" href="contact_info.php">Contact Info</a></li>
</ul>...
IのためにjQueryのファイル(jqueryの-3.2.1.min.js)負荷より多くの機能、ブートストラップ3と気付きます私の背中合わせのリンクは、ブートストラップ4の時より少なくなります。で
ブートストラップ4負荷のみ第2は、ブートストラップ3負荷ながらビューを検査それらのすべて
クリック -backツーtop.js(jQueryの)
クリック - jqueryの-3.2.1.min.js(バブリングDOM2)
とfocusIn - jqueryの-3.2.1.min.js(jQueryの)
focusout - jqueryの-3.2.1.min.js(jQueryの)
マウスアウト - jqueryの-3.2.1.min.js(jQueryの)
マウスアウト - jqueryの-3.2.1.min.js(バブリングDOM2)
マウスオーバー - jqueryの-3.2.1.min.js(jQueryの)
マウスオーバー - jqueryの-3.2.1.min.js(バブリングDOM2)
をブートストラップ前に、私がブートストラップ後popper.jsを入れて、それはそれだったようですアニメーションがうまくいかなかったのはなぜですか? –
@JohnLaimuinスクロールアニメーションを意味しますか?わたしにはできる。あたりです。 –