animate()で上端までスムーズスクロールしたあとにスクロールがしばらく効かなくなります。
animate()で上端までスムーズスクロールしたあとにスクロールがしばらく効かなくなります。
[html]
<!DOCTYPE html>
<html xml:lang="ja" lang="ja">
<head>
<meta charset="utf-8">
<title>jQuery TechnicalNote - SAMPLE</title>
<link rel="stylesheet" href="../../common/css/common.css">
<link rel="stylesheet" href="css/style2.css">
<script src="../../common/js/jquery-1.11.3.min.js"></script>
<script src="js/script2.js"></script>
</head>
<body>
<header class="baseHeader">
<div>
<h1>jQuery TECHNIQUE</h1>
<a href="../../chapterList.html">> CHAPTER LIST</a>
</div>
</header>
<div id="wrapper">
<p>現在のスクロール値:<span>0</span></p>
</div><!-- /#wrapper -->
<footer class="baseFooter">
<small>Copyright © SB Creative Corp. All Rights Reserved.</small>
<footer>
</body>
</html>
[js]
$(function(){
$(window).on('load scroll resize', function(e){
var scrollTop = $(window).scrollTop();
$('p > span').text(scrollTop);
console.log(scrollTop);
var posBottom = $(document).height() - window.innerHeight;
console.log(posBottom);
if(scrollTop >= posBottom) {
//$('p').addClass('scrollBottom');
e.preventDefault();
//戻る
$('body').animate({scrollTop:0},2000);
console.log('scroll!');
} else {
// $('p').removeClass('scrollBottom');
}
});
});