https://recnad.jp/js/jquery.smoothscroll.js

1/* =========================================================*/
2// jquery.smoothscroll.js / ver.1.2
3
4// Copyright (c) 2015 CoolWebWindow
5// This code is released under the MIT License
6// https://osdn.jp/projects/opensource/wiki/licenses%2FMIT_license
7
8// Date: 2015-12-28
9// Author: CoolWebWindow
10// Mail: [email protected]
11// Web: http://www.coolwebwindow.com
12
13// Used jquery.js
14// http://jquery.com/
15/* =========================================================*/
16
17$(function($){
18    $.fn.smoothscroll = function(config) {
19        // オプション
20        var o = $.extend({
21            easing    : 'swing', // 動作パターン
22            speed     : 500,     // スクロールの速度
23            margintop : 0,       // スクロール位置の変更
24            headerfix : ''       // 固定されているヘッダーのセレクタ
25        }, config);
26
27        // #で始まるアンカーをクリックした場合に処理
28        $('a[href^=#]',this).click(function() {
29            // アンカーの値取得
30            var href= $(this).attr('href');
31            // 移動先を取得
32            var target = $(href == '#' || href == '' ? 'body' : href);
33            // 移動先を数値で取得
34            if(o.headerfix != ''){
35                var navHeight = o.headerfix.outerHeight(true);
36                var position = target.offset().top - navHeight  - o.margintop;
37            } else {
38                var position = target.offset().top - o.margintop;
39            }
40            // スムーススクロール
41            $('html,body').animate({scrollTop:position}, o.speed, o.easing);
42            return false;
43        });
44    };
45});