- ベストアンサー
ロールオーバーとスワップイメージとテキスト表示を同時に？
他のカテゴリでも質問しておりますが スクリプト的な内容なのでこちらで質問させて いただきます Javascriptは初心者です。 宜しくお願いします。 ボタンをロールオーバーにして色が変わった時に 横の大画像も入れ替わり表示させて同時に 下にテキストも表示させるものをつくりたいのですが Javascriptで可能でしょうか？ 記述の仕方もよくわかりません。 おわかりになりましたら教えてください また別の方法もありましたら宜しくお願いします
- webchan
- お礼率78% (50/64)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><title>???</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> function ChangeImgF(){ if(document.getElementById){ document.getElementById('x').style.backgroundColor='yellow'; document.getElementById('y').src='images/img_2.jpg'; document.getElementById('z').value='This is an img-2'; }} </script> </head> <body> <input id="x" type="button" value="test" onmouseover="ChangeImgF()"><img id="y" src="images/img_1.jpg"><br> <input id="z" type=text value=""> </body> </html>
関連するQ&A
- ロールオーバーとスワップ（テキスト）を同時に使用する
ロールオーバーとスワップ(テキスト)を同時に使用することは可能なのでしょうか？ 当方初心者です。宜しくお願いいたします。 ↓で失敗しています。 <html> <head> <script> <!-- var content=new Array() content[0]='ここに表示させます' content[1]='表示１' function chgtxt(changecontent){ if (document.all) clip.innerHTML=changecontent else if (document.layers){ document.a1.document.a2.document.write(changecontent) document.a1.document.a2.document.close() } } //--> </script></head> <body> <table> <tr> <td width="200" height="30" valign="top" align="left" bgcolor="#ffffff"><ilayer id="a1" width="200" height="30"> <div id="clip">ここに表示させます</div> </ilayer></td> </tr> <tr> <td><a href="#" onmouseout="chgtxt(content[0])"MM_swapImgRestore()" onmouseover="chgtxt(content[1])"MM_swapImage('Image20','','image2.gif',1)"> <img src="image1.gif" alt="#" name="Image20" width="100" height="30" border="0" id="Image20" /></a></td> </tr> </table> </body> </html>
- ベストアンサー
- JavaScript
- Dreamweaverでimageのロールオーバー
Dreamweaverを使ってimageボタンのロールオーバーを指定すると <head>内に記述されるjavascriptのほか、<body>タグの中にも以下のタグが記述されます。 <body onLoad="MM_preloadImages('menu1_over.gif','menu2_over.gif')"> ()内のgif名はボタンがover時の画像名ですが、ロールオーバーするボタンが膨大だと <body>タグ内も膨大なソース量になってしまいます。 試しに削除してみたところIEでは正常にロールオーバーが動作します。 上記の記述は何を意味しているのでしょうか。 不足な情報があれば補足させていただきますので、お知恵をお貸し下さい。
- 締切済み
- ホームページ作成ソフト
- DWで作成したロールオーバーイメージがサイトで見ると表示されません？？
ご覧くださって有難うございます。 ドリームウィーバーのロールオーバーイメージを使ってボタンを製作したのですが、 ブラウザーチェックで見た時には問題なかったのに、サイトをＵＰしてみたらロールオーバーイメージが表示されず代替テキストのみが表示されてしまいました。 ご指導のほど宜しくお願い致します。。。
- ベストアンサー
- ホームページ作成ソフト
- JavaScriptのロールオーバーに関わるスクリプトを外部に置きたい。
JavaScriptのロールオーバーに関わるスクリプトを 外部に置きたいと考えています。 このページのほかに、より良いと思われる記述方法はないでしょうか。いくつかサンプルがあればうれしいです。 オブジェクト指向JavaScript http://web.paulownia.jp/script/rollover.html
- ベストアンサー
- JavaScript
- スタイルシートでロールオーバー画像上にテキスト表示させたいです
スタイルシートで画像のロールオーバーリンクを作成したのですが、 その画像の任意の箇所にテキストを入れたいのですが(マウスon/off時、内容・箇所同じ)記述の仕方がわかりません。 ご教授よろしくお願いいたします。
- ベストアンサー
- その他（プログラミング・開発）
- 画像のロールオーバーとアクティブページでの画像ロールオーバーについて
javascriptでの画像のロールオーバーについて質問させてください。 現在、あるサイトを作成中なのですが、グローバルナビゲーションメニューにjavascriptで画像のロールオーバーを設定したいと思っています。 このスクリプト自体はwebで簡単に見つかったのですが、これにプラスアルファで現在見ているページ（アクティブページ）のメニュー画像をロールオーバー（ロールオーバーをオンマウス状態に）させる方法が見つかりません。 あらゆるサイトでよく見るので簡単に見つかると思ったのですが・・・ どなたかこの両方の機能を実装できるjavascriptを御存知の方がいらっしゃいましたらご紹介ください。
- ベストアンサー
- JavaScript
- 『Dreamweaver2』でのロールオーバーイメージ
ロールオーバーイメージについて質問です。 元のイメージに、マウスをonするとロールオーバーイメージになり、 outすると元のイメージに戻るんですが、 リンク先に行き、ブラウザの『戻る』ボタンで戻ってくると（onしていないのに）ロールオーバーイメージで表示されてしまいます。 これはどうしようもない事なのでしょうか？ ターゲットを_blankにすると問題は解決するようなのですが、他の解決方法はありませんでしょうか？ よろしくお願いしますm(_ _)m
- ベストアンサー
- JavaScript
- ロールオーバーを含む複数の動作について
製作初心者ですが宜しくお願いします。 今回ホームページを作るにあたり、以下のJavaScriptを使用した動作を検討中です。内容に心当たりがありましたらご教授下さい。 先ず横590px縦300のメイン画像があり、その横に横180px縦50pxの画像を６個にしての設置を行います。 横の180px縦50px画像をロールオーバーにし、更にその画像にマウスを乗せた時に横590px縦300pxのメイン画像も同時に変えたいのですが、これらの動作は可能でしょうか？ また、欲を言えば…ロールオーバーにした画像にリンクを貼り、目的のページへ移動をしたいとも考えております。 参考なサイトとしましては、セブンイレブンのトップページで使用しているフラッシュによる事ですが、あいにくフラッシュは未経験でソフトも無く行えませんので、JavaScriptで可能な限り動作的に行えればと考えております。 参考ＵＲＬ： http://www.sej.co.jp/index.html 自分でも色々探してみましたが、なかなか見つからずスクリプト同士を連結したりして試しても見ましたが動作にバグが生じ、上手くいきませんでした。 そこで、参考になるサイトがあれば教えてください。 宜しくお願いします。
- ベストアンサー
- JavaScript
- テキストをクリックして新たにテキストを表示させる方法
ある大カテゴリのテキスト「×××」をクリックすると、その下に「☆☆☆」とか「●●●」などといった小カテゴリのメニューが表示されたり、また「×××」を表示するとその隣に内容が表示されたりする（ネタばれ禁止のため）というテクニックがウェブサイトで使われていますが、これはなんていうJavascriptの機能を使っているのでしょうか。
- ベストアンサー
- その他（インターネット・Webサービス）
- 異なる大きさのロールオーバーって？
Java Script初心者です。 ロールオーバーは作れるのですが 時々gooのTopページのバナーにあるような オンマウスをすると表示されている画像サイズより 大きい画像に入れ替わるロールオーバーを作りたいのです。 普通に作ったら、大きく変わる画像のサイズ分 余白を取っておかないといけないと思うのですが gooのTopページのバナーは テキストがある上に画像がかぶさるように なっています。 ご存知の方は是非教えていただけますか？ よろしくお願いします。
- 締切済み
- JavaScript
お礼
xepharosさん 早急に対応していただきありがとうございます やってみたら表示はされました xepharosさんのソースを元に 改造していますが・・・ 後はボタン３つの画像に対し３つの色違いのボタン画像と３つの大画像と３種類のテキストを 加えていけばいいかと思いますが・・・ どのように足していくと良いのでしょうか？ もうすこしやってみます