- ベストアンサー
カーソルをのせただけでのリンク
画像にカーソルをのせただけ（触れただけ）で別ページに移る、というものを作ろうとしています。 同じページに表示させることならば出来るのですが、フレームページで作っていて、違う側（左側にリンクを張り、右側に表示させたい）に表示させることがどうしても出来ません。 どうすればよいのでしょうか？どなたか教えてください。お願いします。 ちなみに同じページに表示させるのは <span onmouseover="location.href='ページＵＲＬ'"><img src="画像ＵＲＬ" border="0"></span> でやっています。
- ryu_syuri
- お礼率87% (7/8)
- HTML
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
main.htm - メインのHTML frame1.htm - 左側の画像を表示するフレームのHTML 1.png, 2.png, 3.png - 左側のフレームに表示する画像 1.htm, 2.htm, 3.htm - 右側のフレームに表示するHTML main.htmのソース <html> <head><title>test</title></head> <frameset cols="50%,50%"> <frame src="frame1.htm" name="frame1"> <frame src="" name="frame2"> </frameset> </html> frame1.htmのソース <script type="text/javascript"> <!-- function func( szURL ) { top.frame2.location.href = szURL; return false; } // --> </script> <html> <head><title>frame1</title></head> <body> <span onmouseover = "func('1.htm')"><img src="1.png" border="0"></span> <span onmouseover = "func('2.htm')"><img src="2.png" border="0"></span> <span onmouseover = "func('3.htm')"><img src="3.png" border="0"></span> </body> </html> 1.png～3.png、及び、1.htm～3.htmは自分で作成してください。
関連するQ&A
- ロールオーバーリンクタグとフレームについて
ホームページを改装しているのですが… ロールオーバーリンクタグでメニューのボタンを使おうと思うのですが、このままだと押すと左のメニューの方にリンクしたページが出てしまうのでフレームの右側に表示できるようにしたいのですが… <A href="アドレス"><img src="元の画像" border="0" onMouseOver="this .src='ポイント時の画像'"onMouseOut="this .src='元の画像'"></A> このタグをフレーム向き（？）にするにはどうしたらよいでしょう； いろいろいじってみたのですがタグの仕組みがわからないのでできませんorz 何方か分かる方いらっしゃれば教えていただきたいです（；；）
- ベストアンサー
- その他([技術者向] コンピューター)
- オンマウスで画像を別の場所に表示する
過去ログで似たようなのがあったのですが、 全然わからなかったので、質問しました。 文字オンマウスで、画像を別の場所に表示したいのですが・・ (java～を使わなくてもよいやり方が知りたいです。 java～は使ったことがない初心者ですので。) ちなみに、画像オンマウスで文字を別の場所に表示するのは、 ↓このやり方(html)でできたんですが・・・ <span ID="msg">ここに表示される</span> <a href="ページＵＲＬ"onMouseOver="msg.innerHTML='表示される文字'"onMouseOut="msg.innerHTML=''"><img src="画像ＵＲＬ" border="0"></a>
- ベストアンサー
- HTML
- Aフレームからの操作でBフレームに表示
今日は。 現在HPを作ってるんですが、行き詰ってしまい、質問させて頂きます。 例として、 a.htmlとb.hｔmlの２つのフレームがあり a.htmlの小さな画像にオンマウスすると、b.htmlのフレームに大きな画像が表示される(別フレームに画像が表示されるのはオンマウス中のみです；) というのがしたくて調べたんですが <a onMouseOver="window.parent.フレームの名前.location.href = '大きな画像';"> <img src="小さい画像" border=0> </a> と書けば良いと言うのを発見し、試してみたんですが、小さい画像は表示されるんですが、オンマウスしても大きな画像がb.html に表示してくれません； 私が書いたのは、bodyの中に <a onMouseOver="window.parent.b.html.location.href = '0.mpg';"> <img src="1.mpg" border=0> </a> です。a.htmlの方に書きました。 上のやつを、b.htmlじゃなくbだけにしても駄目でした。 後、 Window.top.frames['main'].document.getElementById('registerForm').submit(); ってのも見つけたのでためしてみたんですが、ダメでした。 他にも、http://oshiete1.goo.ne.jp/qa1555396.htmlのを試してみたんですが、出来ませんでした。 これは、私がやりたいのと少し違ったので、テキストは表示されないように消したりしました； どなたか解決策を教えて頂けないでしょうか。 どうぞよろしくお願い致します。
- ベストアンサー
- HTML
- かぶらないランダム画像
こんにちは。 現在ランダムに画像表示＋画像毎に各リンク＋マウスオーバーで画像切り替え を下記スクリプトで行っております。 function randomImage1() { img = new Array(); img[0] = "photo1.gif"; img[1] = "photo2.gif"; img[2] = "photo3.gif"; img[3] = "photo4.gif"; n = Math.floor(Math.random()*2); url = 'URL1 URL2'.split(' '); document.write('<a href="'+url[n]+'" target="_top"><img src="'+img[n]+'" border="0" onMouseOver="this.src=\''+img[n-0+2]+'\'" onMouseOut="this.src=\''+img[n]+'\'" onClick="location.href=\''+url[n]+'\'"></a>'); } ここで相談です。さらにこのソースを改造して 重複しないでランダムに画像表示させたいのですが、 どこをどう改造すれば良いかアドバイス宜しくお願い致します。
- ベストアンサー
- JavaScript
- リンクとして認識されない
現在HPを制作中です。 フレームページ内のテーブルの上に、６個のリンクを置いています。（TOP、MAIL、DIARYなど） 画像でリンクするようにしていて、マウスを乗せると画像が切り替わるようにしています。 その６個のリンクのうち、トップページ（親フレーム）へのリンク画像だけが、リンクとして認識されてないのか、マウスを合わせても矢印が指先に変わらずクリック出来ません；画像は切り替わりますが… 他の５個はちゃんとリンクされます。タグはコピペしたものだし、打ち間違いだとは思えないのですが、どうしてなのでしょうか？ ↓タグをコピペしてきました <a href="oyaframe.html"target="_top"> <IMG src="画像.jpg" onMouseOver="this.src='画像２.jpg'" onMouseOut="this.src='画像.jpg'" border="0" style="position : relative;top : 数値px;left : 数値px;"> </a>
- ベストアンサー
- HTML
- ▲▲マウスオンで画像を変更について▲▲
<span onmouseout="changeimg.src='h1.bmp'" onmouseover="changeimg.src='h2.bmp'"> <img src="h1.bmp" width="188" height="43" border="0" name="changeimg"> </span> このタグを使っています。適切かどうかはわからないのですが^^ この他のタグでもかまいません、複数画像が変わるものを1つのページに表示させたいと思っています。 何か良いタグはないでしょうか？
- ベストアンサー
- HTML
- 画像リンクでの余白を消したい.(モバスペ)
モバスペでHPを作成しているのですが、 HPを携帯から見たとき、 画像リンクと画像リンクの間に余白が出来てしまいます。 繋げて表示させたいのですが、 どうしたら良いですか？ <BR CLEAR="all>のタグを使ってみたところ、 パソコンから見たら繋がっていましたが、 携帯(au)からは余白が出来ていました…。 無理なのでしょうか？？ ちなみに、下のようなタグを使っています。 <a href="リンク先URL"><img src="画像URL" copyright=yes Border=0></a> <a href="リンク先URL"><img src="画像URL" copyright=yes Border=0></a> 教えてください。
- 締切済み
- その他（インターネット・Webサービス）
- HTMLの画像のリンクについて
ページ内にインラインフレームを作成し画像サムネイルをクリックするとフレーム内に表示するという感じにしたいのですが、フレームサイズを500×500にしたので、このサイズを超える画像を表示するとページのスタイルが崩れてしまいます。元画像のリサイズをせずに表示させる方法はないでしょうか？ 構造は以下のようになってます。 <html> <head> <title>photo</title> </head> <body BGCOLOR="007777"> <br><br> <iframe NAME="photo" WIDTH="500" HEIGHT="500" FRAMEBORDER="0" ALIGN="right"></iframe> <br><br><br> <p> <a HREF="gazou1.jpg" TARGET="photo"><IMG SRC="gazou1.jpg" ALT="" WIDTH="50" HEIGHT="50" BORDER="0"></a> <a HREF="gazou2.jpg" STYLE=""><IMG SRC="gazou2.jpg" ALT="" WIDTH="50" HEIGHT="50" BORDER="0"></a> </body>
- ベストアンサー
- その他（インターネット・Webサービス）
- cssファイルへリンクできないです。
今回からCSSファイルでホームページを作り出している超初心者なので、 専門用語の使い方など間違っているかも分かりませんが知恵を貸してください。 Dreamweaverを使用して、上部に固定ヘッダーのソースをhtmlファイル内に打ち込んで作業をしてます。ヘッダーの下部分の作業をし始めてDreamweaverのデザイン部分の画面で、ヘッダー画像の下に載せる画像や文字が入り込んで隠れてしまうので、作業がしにくいです。 そのため固定ヘッダーデータをcssファイルにした方がいいのかなと思い、 リンクさせようとしたのですが反映されないです。リンクした方がいいのか、その他より効率がいい方法があるのか分からないのでよろしく御願いいたします。 htmlファイルには <body> <link rel="stylesheet" type="text/css" href="banner.css"> と入力してます。 cssファイルには <div id="header"> <img src="img/b01.gif" width="108" height="68" border="0" onmouseover="this.src='../house/img/b01-.gif" onmouseout="this.src='../house/img/b01.gif"> <img src="img/b02.gif" width="88" height="68" border="0" onmouseover="this.src='../house/img/b02-.gif'" onmouseout="this.src='../house/img/b02.gif'"> <img src="img/b03.gif" width="59" height="61" border="0" onmouseover="this.src='../house/img/b03-.gif'" onmouseout="this.src='../house/img/b03.gif'"> <img src="img/b04.gif" width="50" height="68" border="0" onmouseover="this.src='../house/img/b04-.gif'" onmouseout="this.src='../house/img/b04.gif'"> <img src="img/b05.gif" width="39" height="68" border="0" onmouseover="this.src='../house/img/b05-.gif'" onmouseout="this.src='../house/img/b05.gif'"> <img src="img/b06.gif" width="80" height="68" border="0" onmouseover="this.src='../house/img/b06-.gif'" onmouseout="this.src='../house/img/b06.gif'"> <img src="img/b07.gif" width="51" height="68" border="0" onmouseover="this.src='../house/img/b07-.gif'" onmouseout="this.src='../house/img/b07.gif'"> <img src="img/b08.gif" width="47" height="68" border="0" onmouseover="this.src='../house/img/b08-.gif'" onmouseout="this.src='../house/img/b08.gif'"> <img src="img/b09.gif" width="54" height="68" border="0" onmouseover="this.src='../house/img/b09-.gif'" onmouseout="this.src='../house/img/b09.gif'"> <img src="img/b10.gif" width="125" height="68" border="0" onmouseover="this.src='../house/img/b10-.gif'" onmouseout="this.src='../house/img/b10.gif'"> </div> と入力してます。 よろしく御願いいたします。
- ベストアンサー
- HTML
