しゅるしゅる

目次

• オノマトペ
• ソースコード
• 使い方

オノマトペ

ソースコード例

あくまでも一例なので参考程度に使ってください。

しゅるしゅるHTML1

<div id="scroll-point">
/* 飛び先の要素にID指定 */
</div>

しゅるしゅるHTML2

/* 上で作ったIDにリンクを貼る */
<a href="#scroll-point">しゅるしゅるスクロール</a>

しゅるしゅるJS

/* jQueryは別で読み込んでね */
$(function(){
	$('a[href^=#]').click(function(){
		var speed = 1000;
		var href= $(this).attr("href");
		var target = $(href == "#" || href == "" ? 'html' : href);
		var position = target.offset().top;
		$("html, body").animate({scrollTop:position}, speed, "swing");
		return false;
	});
});

使い方

• ページトップへ戻るボタン押したら「しゅるしゅる」でよろしく
• このボタン押したら一番上まで「しゅるしゅる！」ってスクロールできないの？
• 一番上まで戻るアンカーリンクが「パッ！」って一番上までいっちゃってるから「しゅるしゅる」に変えておいて！