• 締切済み

同じ項目で

こんにちは。 JavaScriptを使ってHPを作っているのですが、「OnMouseOver」と「OnMouseOut」と使ったスクリプトがそれぞれ二つづつあり、 <img src="～" OnMouseOver="○○" onMouseOut="○○" onMouseOver="□□" onMouseOut="□□"> と言うように書いても、前のものしか反映されません。 両方とも使いたい場合の記述方法はありますか？ 初歩的なことかもしれませんがここでつまづいてしまって…。 よろしくお願いします。

  • Gozon
  • お礼率46% (46/99)

みんなの回答

回答No.1

こんにちは． 下記で行くんじゃないですか？ <img src="～" OnMouseOver="○○;□□" onMouseOut="○○;□□" >

Gozon
質問者

お礼

回答ありがとうございます。 セミコロンで区切ってみましたが、区切ってみるとどちらも効かなくなってしまいました。 ただ、IEですがスクリプトエラーなどは出ませんでした。 補足になりますが http://www.kensyou.net/html/re/sakurac.htm と http://www2s.biglobe.ne.jp/~club_tom/java-kouza/sample/ri/ri-no1_2/ri-no1_2.htm のスクリプトを併用したいと考えています。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • スワップイメージとロールオーバーの組み合わせで…

    上の画像をクリックした時に下の画像が切り替わるページを 作ったのですが、上の画像をmouseoverで切り替えるのではなく、 マウスを動かしてもクリックしたら下の画像と連動して上の画像も 切り替えることってできますか？？ javascriptは初心者で、まったくわからずです(>-<) <SCRIPT LANGUAGE="JavaScript"> function doPic(imgName) { stepOn = ("" + imgName); document.step.src = stepOn; } </script> （中略） <a href="javascript:doPic('step1.gif');"><img src="img1.gif" name="img" border="0" onmouseover='this.src="r_img1.gif"' onmouseout='this.src="img1.gif"'></a> <a href="javascript:doPic('step2.gif');"><img src="img2.gif" name="img" border="0" onmouseover='this.src="r_img2.gif"' onmouseout='this.src="img2.gif"' ></a><br> <img name="step" src="step1.gif"> ↑こんな感じで作っております<(_ _)>

  • Java ScriptでHTMLのソースを使いまわす方法で、、、

    こんにちわ。 Java ScriptでHTMLソースを使いまわす方法で困っています。 "tes.js"で使いまわしのHTMLを入力してます。 ロールオーバーの処理を記述する前は表示されるのに ロールオーバーの処理をいれると、表示されなくなりこまってます。 HTMLのファイルでは、呼び出す際 <script type="text/javascript" src="common/tes.js"></script>と記述してあり、 Java Scriptのファイル"tes.js"では、 document.write(" <a href='ndex.html'onMouseOut='MM_swapImgRestore()' onMouseOver='MM_swapImage('home','','common/img/menu_home_on.gif',1)'><img src='common/img/menu_home_off.gif' alt='home' name='home' width='42' height='9' border='0'></a>") と記述してあります。 もしかしたら、この処理↓に原因があるかもしれないとおもうんですが、 onMouseOut='MM_swapImgRestore()' onMouseOver='MM_swapImage('home','','common/img/menu_home_on.gif',1)' 誰かわかる方がいらっしゃれば教えていただけたらと思います。よろしくお願いします。

  • 画像をランダムに表示させマウスを重ねるとさらに切り替わる方法

    今ＨＰを作成しているんですが、題名の方法が知りたいです。 JavaScriptを使って画像をランダムに表示させる方法ありますよね。 <script language="javascript"> <!-- //ランダムに画像を表示 img = new Array(); img[0] = "画像1"; img[1] = "画像2"; img[2] = "画像3"; n = Math.floor(Math.random()*img.length); document.write("<img src='"+img[n]+"'　border='0'>"); //--> </SCRIPT> それとマウスを重ねると画像が変わる onmouseover="this.src='画像4'" onmouseout="this.src='画像5'" というタグありますよね。 2つのタグを組み合わせてランダムに表示された画像に マウスを重ねると画像がかわるということがやりたいのですが JavaScriptの知識があまりないためわかりません。 この方法は可能でしょうか？ もしくは他の方法あるでしょうか？ ランダムに表示される画像は３枚と仮定し、 それぞれ３枚の画像はマウスを重ねるごとに 違う画像を表示させたいと思っています。 解決法をわかるかたがいらっしゃったら よろしくお願い致します。

    • ベストアンサー
    • HTML
  • 画像を変えるスクリプト

    <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- img=new Array(); for(i=1;i<=4;i++){ img[i]=new Image(); img[i].src="img"+i+".gif"; } function changeImage(i,j){ document.images[i].src=img[j].src; } // --> </SCRIPT> </HEAD> <BODY> <CENTER> <A href="#" onMouseOver="changeImage(0,2)" onMouseOut="changeImage(0,1)"><IMG src="img1.gif" border=0></A><BR> <BR> <A href="#" onMouseOver="changeImage(1,4)" onMouseOut="changeImage(1,3)"><IMG src="img3.gif" border=0></A> </CENTER> </BODY> </HTML> マウスオーバーしたら画像が変わるスクリプトです。 質問ですがこのスクリプトでどうしてオブジェクトを作っているのでしょうか？ 普通にsrcプロパティを変更するだけではだめなのでしょうか？例えばdocument.images[i].src="img"＋j＋".gif"のようにしてiとjを変えるような 感じです。

  • 外部ファイルの記述の仕方

    HTMLにリンクを指定している画像にマウスが重なったときに画像を変化するようにHTML文法にJavaScriptを指定しているのですが、外部ファイル化したいのですがどのように記述すればよいでしょうか？ <a href="1.html"> <img src="menu01.gif" onMouseOver="this.src=\'menu11.gif\'" onMouseOut="this.src=\'menu01.gif\'" height="30" width="138" > </a> <a href="2.html"> <img src="menu02.gif" onMouseOver="this.src=\'menu12.gif\'" onMouseOut="this.src=\'menu02.gif\'" height="30" width="138" > </a>

  • document.writeln内でマウスオーバー

    現在、HPを制作中なんですがページ数が増えサイドメニューを javascriptで一括管理するようになりました。（SEO的に不利なのを承知の上） しかし、ナビゲーションの画像を↓ <img src='/img/sonota-1.png' hspace='0' vspace='0' onmouseover='this.src='/img/sonota-2.png'' onmouseout='this.src='/img/sonota-1.png'' width='240' height='65' alt='その他'> のように記述していたのですがdocument.writelnで、これを表示させるとマウスオーバー時の 画像がマウスを重ねても表示されません。 要は、「document.writeln」内で「onmouseover='this.src='/img/sonota-2.png'」使うにはどうしたらいいのでしょうか。

  • オンマウスで画像を変えたい。

    オンマウスで画像を変えたいのですが、 ------------------------------------------ <img src="画像１URl" onmouseover="this.src='画像２URl';" onmouseout="this.src='画像１URl';"> ------------------------------------------ や、 ------------------------------------------ <script> var src1="http://img.yahoo.co.jp/images/phonebook/jp_pb.gif" var src2="http://i.yimg.jp/images/news/yjnews.gif" </script> <img src="http://img.yahoo.co.jp/images/phonebook/jp_pb.gif" onMouseOver="this.src=src2" onMouseOut="this.src=src1" /> ------------------------------------------ など。 どれを使っていいか分からず困っています。 これぞ、っていうタグがあったらよろしくお願いします。

    • ベストアンサー
    • HTML
  • javascriptを使って画像のランダム表示とロールオーバーをセット

    javascriptを使って画像のランダム表示とロールオーバーをセットで行いたいのですが上手くいきません… javascript超初心者です…。画像をランダムに表示し、さらにそのランダムに表示された画像をそれぞれ違った画像にロールオーバーさせたいのですが上手くいきません。 一応以下のように書いて試しているのですが、ランダム表示はするのですが、ロールオーバーはエラーがでてしまい画像が切り替わりません。どのようにすれば上手く出来るか、知恵を貸してください。宜しくお願いします。 <html> <body> <SCRIPT language="JavaScript"> <!-- // ランダムに画像を表示する img = new Array(); onMouseover = new Array(); onMouseout = new Array(); // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "top1.gif"; img[1] = "top2.gif"; img[2] = "top3.gif"; img[3] = "top4.gif"; img[4] = "top6.gif"; // マウスオーバー onMouseover[0] = "top1roll.gif"; onMouseover[1] = "top2roll.gif"; onMouseover[2] = "top3roll.gif"; onMouseover[3] = "top4roll.gif"; onMouseover[4] = "top6roll.gif"; // マウスアウト onMouseout[0] = "top1.gif"; onMouseout[1] = "top2.gif"; onMouseout[2] = "top3.gif"; onMouseout[3] = "top4.gif"; onMouseout[4] = "top6.gif"; n = Math.floor(Math.random()*5); document.write("<img src='"+img[n]+"' border='0' onMouseover='"+onMouseover[n]+"' onMouseout='"+onMouseout[n]+"'>"); //--> </SCRIPT> </body> </html> 補足 ●ランダム用の画像が1～5まで、ロールオーバー用の画像がa～eまであるとして、ランダム表示によって1が表示されたらロールオーバーで表示される画像はaのみ、マウスアウトしたら１に戻る、というようにしたいです。同じように2-b,3-c…というように対応させたいです。 ●ページ読み込み時のみランダム用画像をランダム表示させ、後は上記のような流れにしたいです。 長くなりましたが、どなたか回答お願いいたします。

  • onmouseoverに複数の命令を書き込みたい

    こんにちは、初心者の質問です。 画像Aにカーソルを乗せると、別のところにある画像Bが違う画像に変化するようにJAVASCRIPTを使ってスクリプトを書きました。これはうまく作動します。 さらにこの画像Aも（画像A自身にカーソルが乗った時に）別の画像に変化するようにしたいのですが、うまくいきません。 画像Aの記述は以下のようになっています。 <img src="pic1.gif" width="50" height="30" onMouseOut="changeImg(photos[6])" onMouseOver="changeImg(photos[0])"> onmouseoverに　"this.src='マウスが触れた時に表示したい画像のアドレス'"　を追加したいのですが、いかんせん画像Bを変化させるためのスクリプトがすでに書き込まれています。 そこで質問ですが、onmouseoverに複数の命令を書き込むことは可能でしょうか？またそれが不可能な場合上記のようなギミックを作る最善の方法や、解説のあるサイト等を教えていただけるとありがたいです。 詳しい方、よろしくお願いします

    • ベストアンサー
    • HTML
  • onMouseOverで変える位置

    お世話になります。 長文失礼します。 <html> <head> <title>ページのタイトル名</title> <SCRIPT LANGUAGE="JavaScript"> <!-- movimg=new Array() movimg[0] = new Image();movimg[0].src='img/img-01-206.jpg'; movimg[1] = new Image();movimg[1].src='img/img-01-208.jpg'; movimg[2] = new Image();movimg[2].src='img/img-01-213.jpg'; function changImg1(imgNoA,imgNoB) { document.images[imgNoA].src=movimg[imgNoB].src; }; <!----> </SCRIPT> </head> <body> <img src="img/img-01-01.jpg" width="300" height="225">--(1) <img src="img/img-01-208.jpg" width="300" height="225">--(2) <BR> <a href="javascript:function voi(){};voi()" onMouseOver="changImg1(0,0);"> <IMG src="img/img-01-206.jpg" border="0"></a> <a href="javascript:function voi(){};voi()" onMouseOver="changImg1(0,1);"> <img src="img/img-01-208.jpg" border="0"></a> <A href="javascript:function voi(){};voi()" onMouseOver="changImg1(0,2);"> <IMG src="img/img-01-213.jpg" border="0"></A> </body> </html> という風にonMouseOverで画像を変えているようにしているのですが、 この場合(1)の画像がかわりますよね。 これで(2)の画像を変えるようにするにはどうすればいいでしょうか？ 参考になるHPなどでも構いませんのでよろしくお願いします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する