MB-Support

パソコン初心者のサポートページ

サイトのお知らせ:ドロップダウンメニューを復活させました


以前、お手製のドロップダウンメニューを設置していましたが、古い JavaScript とスタイルシートの整理の際に、一旦除去しました。勉強が足りないので、前回のスクリプトを改良せずに、既製のドロップダウンメニューを本日設置しました。 通常、ぶっつけ本番で設置してしまうのですが、今回はローカル環境で何度もテストしています。IE 6 、IE 8 、Firefox 、Chrome 、Safari 、Opera で検証したところ、互換性は確保されている事を確認しました。ただし、動作が若干重いと感じます。



Internet Explorer 8
Google Chrome
Apple Safari
Mozilla Firefox
Opera

Sliding JavaScript Dropdown Menu


JavaScript が OFF の環境では、既存のテキストリンクが表示されます。 非 JavaScript 環境への対応が目的ではなく、新規ソースを読み込むだけで、既存のソースを撤去していない段階です。



スタイルシートを除去したのが右で、赤枠の部分が非 JavaScript 環境で表示されるテキストメニューです。



右が新しいドロップダウンメニューのスタイル未適用の部分ですが、JavaScript で読み込んでいるので、非 JavaScript の環境ではソースに表示される事もありません。 今回の変更作業で、IE 6 の環境で検証したところ、デザインが崩れるページを多く発見しました。 現在はスタイルシートを調整済みです。 制作環境を Windows Vista + IE 8 、Firefox 、Chrome 、Safari 、Opera に移行してから、IE 7 、IE 6 での検証を怠りがちです。 中古 PC に新しい OEM 版の Windows XP が正式に付属可能となり、ネットブックの流行で、購入時点で IE 6 となっている環境が以前より増えました。 さらに、WEB 準拠の IE 8 の自動更新が、日本ではしばらく様子を見る事になったので、なおさら正しく表示できないブラウザが蔓延する状況にあります。



ついでとなりますが、favicon も変更しました。Windows Vista の最大表示 256 × 256 px を含めたマルチアイコンとなります。 IE だけはキャッシュ任せなので、キャッシュが上書きされれば、新しいアイコンに切り替わります。 また、便利なアイコン作成ソフトを見つけました。使い方は以下。

Meta:ホームページのアイコンを登録する favicon



サンプルを交えたホームページの作り方の HTML タグと CSS のページを分割しました。 情報料は少ないですが、ホームページを制作する過程で気がついた事を書き込んでいきます。

2.ホームページを作成する HTML / CSS





Copyright © 2018 MB-Support パソコン初心者のサポートページ All Rights Reserved.

管理人サイト閲覧方法プライバシーポリシー著作権/免責事項