「ページトップへ戻る」を実装 - さまざまなオプション付き「GoUp!」 - jQueryプラグイン
当ページのリンクには広告が含まれています。
スポンサーリンク
「ページトップへ戻る」を実装するプラグイン「GoUp!」を紹介します。
GoUp!
このプラグインを使えば「ページトップへ戻る」ボタンを簡単に実装することができます。
さまざまなオプションが付いているので、お好みの「ページトップへ戻る」ボタンを作成できそうです。おすすめ！
スポンサーリンク
デモページを下にスクロールすると上矢印の画像が表示されるので、クリックしてみてください。ゆっくりとページトップに戻ります。
デモのソース（HTML + jQuery）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="description" content="GoUp!のデモでーす。">
<title>GoUp! - jQueryプラグインまとめ</title>
<body>
<div style="height:2000px">
<h1>GoUp! のデモでーす。</h1>
<p>ページを下へ</p>
<p>スクロール</p>
<p>してみてください。</p>
<p> </p>
<p>下へスクロールすると</p>
<p>ページトップへ戻る</p>
<p>ボタンが表示されるので、</p>
<p>それをクリックしてみてください。</p>
<p>ページトップへ戻ります。</p>
</div>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="jquery.goup.js"></script>
<script>
$.goup({
location: "left",
locationOffset: 400,
bottomOffset: 400
});
</script>
</body>
</html>
jsファイルのダウンロード、その他オプションなどの詳細とはこちらからどうぞ。
» GoUp!
スポンサーリンク