このページは“havin' a coffee break|珈琲とウェブデザイン”の記事、“CSSでページ内リンクをなめらかにスクロールする”のサンプルページです。
$(function(){
$('a[href^=#]').click(function() {
var speed = 500; // スクロール速度(ミリ秒)
var href = $(this).attr("href");
var target = $(href == "#" || href == "" ? 'html' : href);
var position = target.offset().top;
$('html').animate({scrollTop:position}, speed, 'swing');
return false;
});
});
同じページ内のリンク
<p><a href="#sample2">リンク</a></p>
別のページへのリンク
<p><a href="sample-2009281-1.html#sample1">リンク</a></p>
別のページへのリンク
リンクの到達点
<p><span id="sample2">リンクの到達点</span></p>
リンクの到達点