- ベストアンサー
2つのフレームとターゲット属性
- ホームページ作成時に2つのアイフレームを使い、写真を表示する方法に困っています。
- 写真を縮小表示するフレームと原寸大表示するフレームを連携させたいですが、方法が分かりません。
- また、画像を縦に並べる際の余白の問題も解決したいです。
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
まず、親ページのソースをこんな感じにして <HTML> <HEAD> <TITLE>親ページ</TITLE> </HEAD> <BODY> <IFRAME src="メニューページのアドレス" name="photowindow1"></IFRAME> <IFRAME src="画像表示ページのアドレス" name="photowindow2"></IFRAME> </BODY> </HTML> メニューページのソースを <HTML> <HEAD> <TITLE>メニューのページ</TITLE> <STYLE type="text/css"> <!-- IMG{margin : 0px;} --> </STYLE> </HEAD> <BODY> <A href="画像のアドレス1" target="photowindow2"><IMG src="小さい画像のアドレス1" border="0"></A><BR> <A href="画像のアドレス2" target="photowindow2"><IMG src="小さい画像のアドレス2" border="0"></A><BR> <A href="画像のアドレス3" target="photowindow2"><IMG src="小さい画像のアドレス3" border="0"></A><BR> </BODY> </HTML> こんな感じにすればいいのではないでしょうか
その他の回答 (3)
- bita_2005
- ベストアンサー率42% (6/14)
原寸大の画像を表示するページでも余白が出来てしまうということでしたが <HTML> <HEAD> <STYLE type="text/css"> <!-- IMG{ position : absolute; top : 0px; left : 0px; } --> </STYLE> </HEAD> <BODY> <IMG src="" border="0"> </BODY> </HTML> これでどうでしょうか？
お礼
度々のご返答ありがとうございます。 よ～く考えてみると、原寸大の写真を表示した際に コメントも表示させたいので、 今回は自己解決した方法でやる事にしました。 何度もご返答下さったのに申し訳ありません。 ありがとうございました<(＿ ＿)>
- goldfox
- ベストアンサー率49% (123/249)
＞画像を縦に並べて表示する際に余白を作らず ＞表示させたいのですが、 ＞<img src="photo1.png" border="0"> ＞<img src="photo2.png" border="0"> <img src="photo1.png" border="0"><br><img src="photo2.png" border="0"> こんな感じで、タグを続けるように書くといかがですか。
補足
ご返答ありがとうございます。 えっと。。。 何が違うのかがわからないのですが？？ <br> タグを入れるという事でしょうか？ であれば試してみました。 言葉足らずで申し訳ありません。 ありがとうございましたm(＿ ＿)m
- quads
- ベストアンサー率35% (90/257)
どのようにしたいのか分からないので何ともいえないのですが、ページを見せていただくようなことは出来ませんか？ 事の序ですが、imgにはスタイルシートでborder:0を指定してやった方がいいかもしれません。 また、imgタグはalt属性が必須とされています。
お礼
すみません、NO1の方で再度質問した内容に関しては 自己解決しました。 ＃１の方に教えて頂いたやり方だと、 原寸大で表示するフレームに画像をターゲットで指定していたので余白ができてしまっていたようです。 このままでも解決する方法があるのかもしれませんが、 私には解らないため、 私は予め原寸大で画像を表示したページを用意し、 メニューフレームの小さな画像をクリックすると そのページが原寸大のページにターゲットされるようにしました。 ただ、メニューフレームの方で画像に余白が生まれるのはどうにもなりません(＾＾； テーブルや<div class>でもposition指定も試したのですがダメでした… divであれば画像を重ねる事もできるので いけるかと思ったんですが… いまだ解決できずです(泣 書き込む場所がないため、こちらのお礼の方を使わせて頂きました。
補足
ご返答ありがとうございます。 現在インフォシークに登録申請中でして、 まだアップロードできていない状態なのです。 すみません(汗 altタグに関しては忘れていました。 ありがとうございます(＾＾
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_3_thumbnail_img_sm.png)
お礼
素早いご返答ありがとうございます。 フレーム間のリンク設定はうまくできました(＾＾ ですが、 <STYLE type="text/css"> <!-- IMG{margin : 0px;} --> </STYLE> のスタイルシートを追加しても画像の余白は埋まりませんでした。 こうなったらテーブル表示にして、セルの余白を0にするという手段で済ませてしまおうかと思案中です(＾＾； できれば追加の回答が頂きたいので、もう少し締め切らないでおきたいと思います。 ありがとうございましたm(＿ ＿)m
補足
度々すみません、教えて頂いた方法でターゲットする事はできたのですが、 メニューフレームの画像をクリックして もう一方のフレームに表示じさせた際にページに余白ができてしまいます。 原寸大の画像をフレームは丁度大きさを合わせているのですが。 試したタグは、 <style type="text/css"> <!-- body { margin: 0; padding: 0; } --> </style> と、 <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> です。 ご存知の方いらっしゃいましたら、回答をお願い致しますm(＿ ＿)m