小さい画像をマウスで触ると、隣のフレームに大きな画像が表示されるようにするにはどうすればいいんですか?

たくさん並べた小さい画像を次々に触っていけば、
隣のフレームにそれらの大きな画像が次々と出てくる・・といった感じにしたいのです。

今、HP作成中でその部分で手が止まってしまいました。
参考になるサイトも紹介して頂くとありがたいです。

何卒、ご指導のほどよろしくお願いします。ぺこ <(_ _)>

このQ&Aに関連する最新のQ&A

A 回答 (4件)

この場合「フレームの名前」は「大きな画像が表示される方」を入れて下さい。


あとは具体的なソースを見ないと、細かい原因はちょっとわからないのが本音です。
ホームページのアドレスがわかれば、そこに見に行って原因を確かめることもできますが…。
    • good
    • 0
この回答へのお礼

何度も教えていただきありがとうございました!
何とかいろいろ調べ上げた結果、
それらしいものが出来るようになりました。

私はまだHPを載せていないので、見てもらうわけにはいきませんが、
でもおかげ様でとりあえず納得のいくものが出来そうです。d(>_< )Good!!

本当にありがとうございました!!

お礼日時:2001/03/15 11:56

こんにちは。


参考URLの、『カーソルが通過すると別のフレームへイメージを表示』というところを見てみてください。
これですかね~~?

でもコレは、フレーム自体もJavaスクリプトで作ってるようですね~~…。

参考URL:http://www.tetonsoft.com/nhiro/
    • good
    • 0
この回答へのお礼

返答ありがとうございます。
おかげ様で、何とか先へと進めそうです。
この参考サイトも、じっくりと読ませてもらいました。
本当に助かりました。

お礼日時:2001/03/15 12:00

今実際にHTMLを書いて試してみました。


確かに[大きな画像]の場所を'(シングルクォーテーション)で囲まないとエラーが出ますね。

なので、訂正すると、
<a onMouseOver="window.parent.フレームの名前.location.href = '大きな画像';">
ということになります。

この回答への補足

またまたお返事ありがとうございます。

訂正して頂いたとおり入れてみたのですが・・・。
どうも、「フレームの名前」のところでやはりエラーが出るようです。
きちんと名前を入れてるんですが、どういうわけかうまくいきません・・・。
何故なんでしょう・・・?

これって、どっちのフレームに入れるんですか?
小さい画像が並んでる方ですか?
それとも、大きな画像が表示される方ですか?
もしかしたら、根本的なところから間違えているのかもしれません・・・・(ーー;)

HPを作るのは、これが初めてなもので・・・。
「初めてならもっと簡単なものにしろよ!」 と、
お叱りの声が聞こえてきそうですが、
どうしてもあきらめきれません(笑)。

またまたわがままな質問ですが、何卒よろしくお願いします。

他にもわかる方がいらっしゃいましたら、
ゼヒ、コメントのほど、よろしくお願いします。

補足日時:2001/03/14 16:14
    • good
    • 0

基本的にはonMouseOverを使えば簡単だと思いますけど。


<a onMouseOver="window.parent.[フレームの名前].location.href = [大きな画像];">
<img src="小さい画像" border=0>
</a>
なんて感じで書けば大丈夫では?

詳しくは、ここをお読みの方にはまいどおなじみの「とほほのWWW入門」(URLは下記)を読むとわかりやすいです。

参考URL:http://wakusei.cplaza.ne.jp/twn/www.htm

この回答への補足

お早い返答ありがとうございます。
実は、前々から参考サイトには何度も足を運んでいました。
が、私はド素人のため
今ひとつ理解できず、頭を抱えるばかりです。

そこで、cockyさんが書いてくれた通りに入れてみましたが、
エラーがでてしまいました・・・・(-_-;)。
エラーの個所は、「window.parent.[フレームの名前].」
の部分でした。
できれば、もう一度詳しく書いてくれませんか?
わがままを言ってすみません・・・・m(;∇;)m
何卒、よろしくお願いします。

補足日時:2001/03/13 16:55
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aと関連する良く見られている質問

Qフレーム内に画像を表示する際、画像をフレームサイズに合わせたい。

Webページで、フレームを使ってるんですが、フレーム内に表示する画像のサイズがマチマチで(画像の元サイズがとても大きかったりして)見栄えが良くありません。
main.htmlというソースを置いて、そこからタイトル表示用HTMLと画像リスト用HTMLをフレーム内に表示。
画像リスト用HTMLからAタグで画像表示用フレームに画像を表示するよう記述。
単にこれだけだと、ブラウザごとに画像サイズがフレーム内に収まるよう調整されたり、されなかったりなんですよ。
どうにか、強制的にフレーム内に表示させるようにする方法を教えてください。
-------------------------------------------------
main.htmlの抜粋↓
-------------------------------------------------
<frameset rows="50,*">
<form name="frm1">
<frame src="title.html" name="ue">
<frameset cols="187,*">
<frame src="list.html" name="hidari">
<frame src="./img/1.jpg" name="migi">
</frameset>
</form>
</frameset>
-------------------------------------------------
list.htmlの抜粋↓
-------------------------------------------------
<a href="img/2.jpg" target="migi">19</a>

Webページで、フレームを使ってるんですが、フレーム内に表示する画像のサイズがマチマチで(画像の元サイズがとても大きかったりして)見栄えが良くありません。
main.htmlというソースを置いて、そこからタイトル表示用HTMLと画像リスト用HTMLをフレーム内に表示。
画像リスト用HTMLからAタグで画像表示用フレームに画像を表示するよう記述。
単にこれだけだと、ブラウザごとに画像サイズがフレーム内に収まるよう調整されたり、されなかったりなんですよ。
どうにか、強制的にフレーム内に表示させるようにす...続きを読む

Aベストアンサー

あふれる画像がブラウザの中に納まるのは
ブラウザのオプションに依存しているので、
それをコントロールしようというのはかなり
困難だと思います。

どうしてもというのであれば姑息で、あまり
美しくないですが、以下のような手も検討して
みてはいかがでしょうか?

<a href="view.htm?img/2.jpg" target="migi">19</a>
としてview.htmを以下のように記述します。
すると元データが大きくても小さくても200x200の画像
として表示されます。
クリックすれば、正式なサイズの画像が表示されます
(あんまり「/」とかパラメータ渡ししちゃいけない
んでわかるなら%2Fなどで代替してほしいところです)

<body>
<img src="" width="200" height="200" id="idImg" alt="null" onClick="window.open(objImg.src)"><br>
画像をクリックしてください<br>
<script language=javascript>
objImg=new Image();
objImg.src=location.href.split("?")[1];
document.getElementById('idImg').src=objImg.src
</script>
</body>

あふれる画像がブラウザの中に納まるのは
ブラウザのオプションに依存しているので、
それをコントロールしようというのはかなり
困難だと思います。

どうしてもというのであれば姑息で、あまり
美しくないですが、以下のような手も検討して
みてはいかがでしょうか?

<a href="view.htm?img/2.jpg" target="migi">19</a>
としてview.htmを以下のように記述します。
すると元データが大きくても小さくても200x200の画像
として表示されます。
クリックすれば、正式なサイズの画像が表示されます
...続きを読む

Qインラインフレームの隣に画像を表示

メモ帳を使ってホームページの作成をしています。

インラインフレームを画面の左側に設置し、右側に画像(メニューアイコン等)を置きたいのですが、align="left"と書いてみたら右側の画像が消えてしまいました・・・。

インラインフレームと画像を左右に並べることはできないのでしょうか?

スタイルシートとかjavascriptはまだよくわからないんですが、そういうのを使えばできるのかな・・。

よろしくお願いします!!

Aベストアンサー

ひょっとしたら</Iframe>が<img src="">の前などに抜け落ちてるんじゃないでしょうか?もし抜け落ちていたとしたら画像は消えますし。
普通は左右に並べることはできます。

QInternet Explorerになぜフレームイン(フレーム外し?フレームリンク?)の機能がないのでしょうか?

 ど近眼で、しかも15インチCRTなので、640×480ピクセルで見ていますが、そうすると、2~3個フレームがあると、各フレームがせまくて見づらくて仕方ありません。
 Internet Explorerなどのブラウザには、なぜフレームイン(フレーム外し?フレームリンク?)の機能がないのでしょうか?
 ついでに、そういう機能をもったブラウザソフトがあるならば紹介してください。

Aベストアンサー

ツールなら、YunaToysが便利ですね。
このソフトを使えば、右クリック→ゆなデュプリケート という操作で、フレームの中身のみを新しいウインドウで開くことが出来ます。

参考URL:http://www.uryusoft.com/

QCSSを使って画像をクリックすると別フレームに大きな画像を表示したい

よろしくお願いします。

JAVAとか使うと警告メッセージが表示されるので、そういったメッセージが出ないcssをつかって次のようなことがやりたいのですがどうぞ教えてください。

フレームで2つに割ったページで、左にサムネイルを表示しておいて、そのうえにカーソルを持っていくだけで右のフレームに大きな画像を表示させたいのです。

よろしくおねがいします。

Aベストアンサー

参考先に上げられたサイトさんはCSSのhoverという動的疑似クラスをうまく利用されているみたいですけど。
(マウスポインタが上にある時に適用するCSSの書式を変える

ただ、恐らくこのやり方では複数のページにまたがってやるのは無理だと思います。

参考にあげられた先のページでしっかり解説されていますけど^^;(英語でソースを明示してくれているだけだけど
ソースを見て何をしているのかが分らないようだと、ちょっと応用は厳しいと思いますが・・・・。

Qアルバムをめくるように、画像を次々に表示させたいのですが。

タグ手打ちで、独学でサイトを作っている者からの、HTMLについての質問です。
「こういう風にできないかな」と漠然と考えているだけなので、用語がわからず過去の質問が検索できませんでした。
また、そんな都合のいい方法があるかどうかもわかりません。あらかじめご了承下さい。

現在、
写真は<a href="gazou-001.html" onclick=" window.open('gazou-001.html', '_blank', 'width=350,height=200'); return false;">こちら</a>

のように、ポップアップ状態で小窓を表示させ、その中に画像を入れています。また、さらに画像の下に「次・戻る」などの、別の画像に移るリンクを入れようと思います。
ですがこの方法ですと、画像の枚数分「gazou-###.html」ファイルをつくらなくてはなりません。(画像の枚数は、100枚以上には増える予定です)
それは仕方ないことですか?

「###」の部分に任意の画像番号を放り込んで、「gazou-###.html」を一つのファイルで済ませるようなことはできるでしょうか。

最後まで読んで頂きまして、ありがとうございました。

タグ手打ちで、独学でサイトを作っている者からの、HTMLについての質問です。
「こういう風にできないかな」と漠然と考えているだけなので、用語がわからず過去の質問が検索できませんでした。
また、そんな都合のいい方法があるかどうかもわかりません。あらかじめご了承下さい。

現在、
写真は<a href="gazou-001.html" onclick=" window.open('gazou-001.html', '_blank', 'width=350,height=200'); return false;">こちら</a>

のように、ポップアップ状態で小窓を表示させ、その中に画像を入れてい...続きを読む

Aベストアンサー

htmlにフォトアルバムのような作りのFLASH(swfファイル)を張り付けて、画像を読み込ませては、いかがですか?
参考URLの素材屋さんの「フラッシュ素材」「フォトアルバム」の中の「スライドショー」等は要望されている形に近いでしょうか?

参考URL:http://flash-bucks.com/flash/album/index.html


このカテゴリの人気Q&Aランキング

おすすめ情報