見出し画像

[Blogger #005] ページトップに戻るボタン、ページ最下部へ飛ぶボタン、追加

今日もまた、真似です。長い記事を書くと必須といっていいのが、この右隅にあるトップ・ボトム行きのボタン。

ふじろじっくさんところは、上のタイトルに月、トップに戻るボタンがロケットという、すごくシュールなデザイン。ロケットボタンを押すと、月に向かって飛んでいくイメージなんですね。

スクリーンショット 2021-01-21 134350

まあ、タイトルに月を貼る予定がないので、矢印でいきます。解説ページはここ。

後から追記したのが下にあるので、そちらをコピペ。以前にjQueryは入れておいたので、そこは、カット。

あとは、アイコンをどんなのにするか。FontAwesomeってとこに行ってお気に入りのフォントを探します。

ページから、フォントを選んで、この上にあるHTMLを入れ替えます。

画像2

こんな感じ。そのままだと、サイズが小さいので、サイズ指定を追記します。サイズは、”fa-3x”ってのを追記して、3をいじくると変わります。数字が大きと大きくなります。

スクリーンショット 2021-01-21 141828

リロードしてみて調整、4にしました。

スクリーンショット 2021-01-21 142402

いい感じに完成。今日はここまで。

いいなと思ったら応援しよう!