jqueryでページトップを使用する（例）

ページトップのJSを使用する場合（例）

定義側js↓

pageTop.js

$(window).load(function(){
  function pageTop () {

	var $main         = $('html, body');
	var $pTop         = $('.pagetop');
	var $header       = $('header');
	var $scrollPos    = '';
	var $headerHeight = $header.outerHeight();
	var $headerOfset  = $headerHeight + $header.offset().top;


	//ページトップボタン非表示
	$pTop.hide();

	$(window).on('scroll', function() {

		$scrollPos = $(this).scrollTop();

		if ($headerOfset < $scrollPos) {
			$pTop.fadeIn();
		} else {
			$pTop.fadeOut();
		}

	});

	$pTop.on('click', function() {

		$main.animate({
			scrollTop:$main.offset().top
		}, 2000, "easeOutQuint");

		return false;

	});

  }
});

呼び出し側js↓

common.js

$(window).load(function(){
  pageTop();
});

定義側html↓

index.html

<script src="./js/jquery-1.11.0.min.js"></script>
<script src="./js/jquery.easing.1.3.js"></script>
<script src="./js/pageTop.js"></script>

jquery.easing.1.3.jsは別に読まなくてもページトップのjsを使用できるが、easingを使用する際は必須。
もし、必要ないなら、「easeOutQuint」を消す。