2/03/2011

bodyタグ内のHTML5化(ページトップへ戻る固定リンク)




bodyタグ内のHTML5化をする前に
どういう順番でやっていくのかを先に表明

1.ページトップへ戻る固定リンク

2.ヘッダー・フッター

3.サイドバー(ナビ部分)

4.メイン(本文部分)

そんなカンジで1.ページトップへ戻る固定リンク、だ

どういうコトかと言えば
元のページは段落の最終行にページトップへ戻るリンクがあった

これはトップページだけではなく
総てのページがこのようになってたのだが
includeやreadfileで読み込むにしても
PHPのコードを1行コピペするワケで
HTMLをベタにコピペするのと徒労は変わらなくて
100ページも作るとこの作業が1番煩わく思えた。(´д`;)ギャボ

それが画面右下に固定されたページトップへのリンクボタンを
jQueryで実現できるようなので試してみた
LINK:jQuery Scroll to Top Control v1.1

まずheadタグ内に記述するソースをコピーして
index.htmlのheadタグ内にペースト
jsファイルをリンク先からコピペして作成
リンクボタンの画像はこちらで用意して
ダウンロードできるサンプル画像と同じ名前に
以上の3つをアップロードして
ブラウザから確認・・・

驚くほど簡単に実装された!
だがしかしリンクボタンの画像の大きさがw
jsファイルを開いて画像のサイズを修正したらOK

確認画面

これは別にHTML5化とは関係ナイついでの修正なので
どのブラウザでも問題なく実装できてるるる~
換言すればどのブラウザでも
JavaScriptがOFFだと無効なのだがな。(゚д゚lll)ギャボ