Edited at

ページ内リンクでスムーズスクロール

More than 1 year has passed since last update.

jqueryを読み込んで、下記コードを入れるだけ。

※こちらはjquery1系列のみ動作します


scroll.js

$(function(){

// #で始まるアンカーをクリックした場合に処理
$('a[href^=#]').click(function() {
// スクロールの速度
var speed = 400; // ミリ秒
// アンカーの値取得
var href= $(this).attr("href");
// 移動先を取得
var target = $(href == "#" || href == "" ? 'html' : href);
// 移動先を数値で取得
var position = target.offset().top;
// スムーススクロール
$('body,html').animate({scrollTop:position}, speed, 'swing');
return false;
});
});

jquery2系列、3系列の場合は下記


scroll.js

   // #にダブルクォーテーションが必要

$('a[href^="#"]').click(function() {
var speed = 400;
var href= $(this).attr("href");
var target = $(href == "#" || href == "" ? 'html' : href);
var position = target.offset().top;
$('body,html').animate({scrollTop:position}, speed, 'swing');
return false;
});
});