FlashもしくはJavascriptを利用したインパクトのあるナビゲーションメニュー
- ホームページの作成でFlashもしくはJavascriptを使用したインパクトのあるナビゲーションを設置する方法について相談です。
- ナビゲーションのイメージは、メインの画像エリアと複数のボタンで構成され、ボタンにマウスオーバーすると画像エリアの画像が切り替わり、ボタンをクリックするとリンク先へジャンプする形です。
- 具体的な例として、以下のURLで使用されているフラッシュや配布されているスクリプトがイメージに近いですが、もっと近い素材を探しています。
- ベストアンサー
FlashもしくはJavascriptを利用したナビゲーションメニュー
ホームページの作成でトップページに FlashもしくはJavascriptを使用してインパクトのあるナビゲーションを設置を検討しています。 現在考えているナビゲーションのイメージとしては ・メインの画像エリアと複数のボタンで構成 ・各ボタンにマウスオーバーすると画像エリアの画像を切り替え ・各ボタンをクリックすると任意のリンク先へジャンプ といった形です。 いろいろと探してみましたが一番イメージが近いものは以下のURLで使用されているフラッシュです。 http://www.intheroom.jp/ ここはメインの画像エリアが自動的に切り替わったり、画像の切り替えにエフェクトがかかりますがここまでは必要ないです。（あると尚よいですが・・） 以下で配布されているスクリプトもイメージに近いです。 http://jqueryglobe.com/labs/feature_list/ ここはマウスオーバーで画像が切り替わらず、クリックしても別のURLには飛ばない点が残念です・・・。 もし私のイメージに近い形で配布されている素材をご存じでしたら教えていただけないでしょうか？ よろしくお願いいたします。
- love-uni
- お礼率43% (13/30)
- Flash
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
どちらもマウスオーバー自体は難しくないものです。 Flashの場合、画像をレイアウトするときに、マウスオーバーの設定をするので、画像が2枚あれば、あとはリンクの設定時にレイヤーを分けて設定します。（素材とは関係なく、Flashの設定で行います） JavaScriptについても、マウスオーバーは素材と直接関係ありません。 http://www.openspc2.org/reibun/javascript/mouse/029/index.html こちらがサンプルです。 リンクの設定に、onMouseoverとonMouseoutを使って、マウスが重なったときと外れたとき（戻すため）で画像を入れ換えます。このとき、画像はどこにあっても構いません。画像に名前（ID）を付けて、スクリプトではその名前を指定して画像を差し替えています。 Flashの方が手間がかかると思いますので、JavaScriptをコピーしてやってみると良いかと思います。 画像だけは先に用意して置いた方が良いですね。
関連するQ&A
- CSSでグローバルナビゲーションメニューをつくりたい
CSSで、グローバルナビゲーションメニューのボタンリンクをコーディングしたいと思っています。ボタンをマウスでポインタしたらロールオーバーし、カレントページのボタンはマウスでポイントした時と、同じようにロールオーバー画像を表示させたいと思っておりますが、可能なのでしょうか？
- 締切済み
- ブラウザ
- CSSのcurrentを使ったグローバルナビゲーションの作り方
CSSのcurrentを使ったグローバルナビゲーションの作り方を教えてください。 以下のように二枚のつながった背景画像をロールオーバーさせるCSSのcurrentを使ったグローバルナビゲーションの作り方を教えてください。 画像URLと参考サイト http://www.kagaya.co.jp/images/menu_gNav.gif http://www.kagaya.co.jp/index.php
- ベストアンサー
- HTML
- 簡単なJavaScriptなんですが
セル内にボタン（menu01.gif)があって、マウスオーバーしたら別の画像(menu02.gif)に変わり、クリックたら別のファイルに飛ぶ、というJavaScriptを教えてください。 Dreamweaver３で作ったら、OnClickの設定ができずマウスオーバーしただけでURLに飛んでしまうのですがどう直していいのか分からないのでよろしくお願いします。 <td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image10','','img/menu02.gif',1);MM_goToURL('parent','index.html');return document.MM_returnValue"> <img src="img/menu01.gif" width="167" height="20" border="0" name="Image10"> </a> </td>
- ベストアンサー
- JavaScript
- javascript画像の切り替えについて
javascriptでの画像切り替えについて、どなたか教えていただけますでしょうか？ やりたいことは、ユニクロの商品ページのカラー選択のような、↓↓ http://store.uniqlo.com/jp/CSaGoods/472513 サムネイルにマウスオーバーするとメイン画像が切り替わり、 マウスアウトすると、一番最初の画像に戻り、 クリックすると、選択した画像が固定されてメイン画像に表示される、 という動きです。 実際に下のようなソースを作ったのですが、 マウスオーバーとマウスアウトはきちんと動作しても、 クリックしたときに画像が固定されなくて困っています。 どなたか教えて頂けませんでしょうか？ よろしくお願いいたします。 ------------------------------------------- <div id="item_main"> <img src="メイン画像のURL" alt="" name="main" /></div> <div id="item_sum"> <p> <img src="サムネイルのURL1" width="24" height="24" onMouseOver="document.main.src='メイン部分に表示させたい画像のURL1;" onMouseOut="document.main.src='メイン画像のURL';" onClick="document.main.src='メイン部分に表示させたい画像のURL1';" /> <img src="サムネイルのURL2" width="24" height="24" onMouseOver="document.main.src='メイン部分に表示させたい画像のURL2;" onMouseOut="document.main.src='メイン画像のURL';" onClick="document.main.src='メイン部分に表示させたい画像のURL1';" /> <img src="サムネイルのURL3" width="24" height="24" onMouseOver="document.main.src='メイン部分に表示させたい画像のURL3;" onMouseOut="document.main.src='メイン画像のURL';" onClick="document.main.src='メイン部分に表示させたい画像のURL1';" /> </p> </div> </div> ----------------------------------------------------
- 締切済み
- JavaScript
- 画像がランダムに表示されるFLASH
いつもお世話になっています。 以下のようなFLASHを作りたいのですが、やり方がわからず困っています。 (1)リロードするたびにランダムで切り替わる画像１～６がある (2)画像の横にボタン１～６があり、マウスオーバーするとそれぞれ画像１、画像２…と表示される (3)ボタン１～６をクリックするとwebページ１～６へジャンプ(リンクさせている) 上記目的のうち、(2)(3)については完成しています。具体的にはAフレームには画像1、Bフレームには画像2…と配置し、ボタン1～6のアクションスクリプトにそれぞれ「マウスオーバー時にAフレームに飛ぶ」と記述しています。そしてメインのタイムライン1フレーム目にはアクションスクリプトに「ボタン1がクリックされたらwebページ1へ、ボタン2がクリックされたらwebページ2へ…」と記述しています。 これで(2)(3)の目的は果たせており、問題は(1)です。 ランダム表示される画像があり、ボタンのマウスオーバーで指定した画像が表示され、クリックでwebページへとぶ、ためにはどこにどんな記述をすれば良いのでしょうか？ ちなみに作ったFLASHがサイトのトップページの一部となり、クリックで飛ぶwebページはそのサイト内です。 アドバイスいただけると助かります。 どうかよろしくお願いします。FLASHは上記がほぼ初めての挑戦である初心者です。
- ベストアンサー
- 画像・動画・音楽編集
- 複合型（？）flashバナーの作り方
こんにちは。 アドビProfessional.8をXPで使用しております。 最近よく見るflashバナー(複合型バナー？)の作り方が知りたいのです。 イメージとしては、フラッシュ内にボタンが並んでおり、 そのボタンにマウスオーバーでフラッシュ内の画像が (出来ればアクションをつけながら)変わり、クリックでページ移動する といった内容です。 説明がわかりにくいと思いますので、参考URLを添付いたします。 http://www.bk.mufg.jp/ (上部、右側のフラッシュバナーです。) 自分で調べようにも、どんな構造なのか、このflashバナーを何と呼ぶかが分かりませんので、困っています。 どなたかご教授下さいませ。 宜しくお願いいたします。
- 締切済み
- Flash
- FLASH8についての質問
FLASH初心者です。例えば、ドキュメント上にボタンが3つあり、それをクリックすると、画像がでてくるようにします。それで、常に、クリックしたボタンで出る画像を一番上に表示するようにしたいのですが、どうすればよいでしょうか？swapDepthsを使えばできますでしょうか？ すみません。よろしくお願いします。
- ベストアンサー
- グラフィックソフト
- 外部読み込み画像のスライドメニューの動き
Flash初心者です。 環境：WindowsXP,Flash8,as2.0 独学でFlashを学んでいて、練習として下記URLのFlashを制作しています。 http://homepage2.nifty.com/meary/ まず、外部読み込みの画像（サムネイルのようなもの）をボタンとしています。 そして、そのボタンをまとめてMCにして、 上下のスクロールボタンをクリックするとそれぞれ上下にスライドする、というところまで制作出来ました。 ですが、私の希望の動きはドコモのサイト http://www.nttdocomo.co.jp/ のFlash部分、下の方のFlash用コンテンツメニューの様な動きなのです。 スクロールボタンをクリックしなければ「ボタン部分のMC」は一定時間ごとにスライドし、出来れば「ボタン」にロールオーバーしている間は「ボタン部分のMC」を停止させる。マウスが離れたらまた動き出す。 初心者ながら、ネットや本でASを調べてみましたが、 うまくこのように動いてくれず行きずまってしまいました。 上述の様な動きをさせるにはどのようなASを記述すればいいのか、やりやすいのか、ご教授いただけませんでしょうか。
- 締切済み
- Flash
- Flashを使ってのボタンのスクロールダウンの作成方法
いつもお世話になっています。 Flashを使ってのボタンのスクロールダウンの作成方法 について質問です。 地図を作成し、リージョンボタンをマウスオーバーされたときに、 国名のスクロールダウン（添付図参照）を表示したいと考えています。 マウスオーバー時にプルダウンで表示、 というのはできるのですが、 それでは国数が多いときに問題があり、 そのためスクロールダウンを考えています。 スクロールダウンをFlashで作成するには どうすればよいでしょうか。 動きは以下の通りです。 ・エリア名ボタンのマウスオーバー ・スクロールダウンの国名一覧の表示 ・クリックでその国のページに飛ぶ 使用しているソフトは以下です。 Adobe Flash CS3 宜しくお願いします！
- ベストアンサー
- Flash
- ナビゲーションについてですが・・
http://www.condo.fromc.jp/flash/memo/index.html 有名なサイトですが、このページの上から5つめの、 ■スライド式メニュー (2003/11/2) コンテンツがスライドして現れるメニューです。 のサンプルなのですが、これはクリックするとスライドコンテンツが現れるというもののようですが、 これをクリックではなく、マウスを乗せるとスライドする、（マウスオーバーで動作させる）となるとどこをどう変えればいいのでしょうか？ できればこのサンプルのスクリプトを書き換えた形で教えていただきたいのですが、お詳しい方おられましたらどうかお願いいたしますm(_ _)m
- ベストアンサー
- Flash
お礼
回答ありがとうございました。 なるほど、それほど難しく考える必要はなかったのですね。 参考URLのコードなら自分自身でいろいろと修正できそうです。 ありがとうございました！