人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ホームページ作りに初挑戦しています。
産経新聞のHP(http://www.sankei.co.jp/)の画面左上に、「紙面から>>」という所があり、そこにマウス(ポインター)を乗っけると、クリックしないでも「東京朝刊」とか「大阪夕刊」とかがリストみたいな形で表示されます。 すごくスマートなのでこれを作りたいのですが、(1)この表示形式は何と呼ぶのでしょうか? (2)この表示形式を実現する方法を説明しているページが有りましたら教えて下さい。よろしくお願いします。Dan

●質問者: Dan
●カテゴリ:ウェブ制作
✍キーワード:クリック スマート ホームページ ポインター マウス
○ 状態 :終了
└ 回答数 : 10/10件

▽最新の回答へ

1 ● kazooo3
●20ポイント

http://www.wakusei.ne.jp/twn/lng/b200006/00060054.htm

そのファイルは現在ありません

マウスオーバーといいます。JAVAスクリプトです。初心者にはかなり難易度が高いものです。ちょっと初挑戦では難しいかと思われますが参考URLを貼って置きますね。

◎質問者からの返答

ありがとうございました。難しそうですね。でも理解するよう努めます。


2 ● lowcarbo
●20ポイント

http://www.dansteinman.com/dynduo/

通常、Dynamic HTML で実現します。

The Dynamic Duo(下記)の「MenuBar」などがイメージに近いのでは?

◎質問者からの返答

ありがとうございました。英語に理解が十分ではないのですが、Menu Barみたいですね。

もう少し読んでみます。


3 ● hejihogu
●0ポイント

http://homepage.mac.com/toda/html/26_map.html

(1)クリッカブル・マップと呼ばれています。

(2)下記のサイトに分かりやすい説明がありました。

◎質問者からの返答

ありがとうございました。

でもクリッカブル・マップではないと思うのですが・・・


4 ● nyankochan
●20ポイント

http://www.navida.ne.jp/sangyo/index.html

神奈川県の商品・製品・技術・サービスの検索情報サイト【産業Navi】

産経新聞とほぼ同じ仕掛けをしているページの作成などをしています。

URLのペ-ジの左側の矢印マ-クのついた部分です。

これは、レイヤー機能とjavascriptの組み合わせによるものです。

レイヤーをスタイルシートで隠しておいて、経営や取引の部分の

画像にマウスが重なると表示されるというものです。

ちょっと複雑なソースになってしまいますが、

スタイルシートにて”hidden”属性で隠し

javascriptの”MM_showHideLayers””MM_swapImage””MM_swapImgRestore”

でマウスの位置判定においての表示、再隠しを制御します。

このページをHP作成ソフトで開くとわかると思いますが

レイヤー等、隠し属性になっていても表示されるので

仕組みが理解できるかもしれません。

また、レイヤーですの表示される位置も個々にスタイルシート等で

指定してあげなければいけません。

なにか気に入ったデザインや仕組みがあったら、そのページをそのままそっくりダウンロードしてきて

ソースを見て、ここが怪しいとか思うところを

真似てみるとよいかもしれません。

ダウンロード方法は、ブラウザのメニューのところにある

”名前をつけて保存”等でできます。

◎質問者からの返答

ありがとうございました。

確かに産経新聞のと同じですね。

ただ、今まで回答していただいた方の情報を元に調べていると、「プルダウンメニューのマウスオーバータイプ」というのが一番近い気もします。教えていただいたURLでもプルダウンになってますよね。そういう理解で良いのでしょうか?


5 ● hiikun
●40ポイント

http://www115.sakura.ne.jp/~boss/ako_js/akotopmenu/akotopmenu.ht...

1番目〜3番目は、DHTMLですね。

2番目・3番目は英語ですが設置はそんなに難しくないですよ。

4番目・5番目は、shockwaveを使用したやり方です。

ページのTOPに貼るタイプですね。

http://dynamicdrive.com/dynamicindex1/hvmenu/index.htm

Dynamic Drive DHTML Scripts- HV Menu 5.5

http://dynamicdrive.com/dynamicindex1/jsdomenu/index.htm

Dynamic Drive DHTML Scripts- JsDOMenu 1.3

http://kei.serio.jp/flash/sozai/general2/ExtendMenuII.html

Kei Laboratory : Flash素材

http://kei.serio.jp/flash/sozai/general/index04.html

Kei Laboratory : Flash素材

◎質問者からの返答

ありがとうございました。色々な方法があるのですね。大変助かりました。


1-5件表示/10件
4.前の5件|次5件6.
関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ