個人事業主の方必見!確定申告のお悩み解決

ホームページ制作上で以下サイトのような効果が分からず質問させて頂きます。
http://panasonic.jp/

各カテゴリのBOX「デジタル・AVC」などに使用している効果です。
-----
通常時 Flashのように画像が切り替わり
マウスオーバー時にメニューが表示(メニューもon/off効果)→更に各製品へリンク
-----

Flashを使用なのかjavascriptを使用しているのか単にcssによる手法なのか
頭悩ませています。

お分かりになる方ご教授お願い申し上げます。
何を使用しているだけでも結構です。。

このQ&Aに関連する最新のQ&A

A 回答 (3件)

>通常時 Flashのように画像が切り替わり


ここはjavascriptです。html上ではすべての画像を出力しておいて、それをjavascriptで順番に切り替えています。

>マウスオーバー時にメニューが表示
これもjavascriptです。メニューの部分もhtml上は全て出力しておいて表示上は消しておきます。表示されているバナー画像の領域にマウスオーバーするとその部分にメニュー部分を表示させています。メニューの文字はサイズを合わせるためにそれぞれテキストではなく画像を使っていますね。

>(メニューもon/off効果)
ここはCSSのhoverを使ったロールオーバーです。(a要素にhoverで背景=矢印アイコンを切り替え)です。
    • good
    • 0

スタイルシートですね。


firefox+fireBugで調べるとよいです。
Firefox アドオン - Firebug | Mozilla Japan ( https://addons.mozilla.jp/firefox/details/1843 )
    • good
    • 0

途中まで、追っかけてて断念してしまったのですが、


CSSで実現しているのではないでしょうか?

ddタグのbackground url属性にアニメーションgifを指定し、
ddのタグの内側でliタグを使ってロールオーバーを実現してるようです。

当方は、CSSが詳しくないので2段のロールオーバーが実現できるかわからないのですが、
メニュー表示の方はロールオーバーである事はソースから確認しました。
    • good
    • 0
この回答へのお礼

ご回答ありがとうございます。

ソースからはやはりCSSでなんとかしてるみたいですね。
ちょっと気合い入れてやってみます。

お礼日時:2011/04/07 14:46

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング