
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>
No.1ベストアンサー
- 回答日時:
あふれる画像がブラウザの中に納まるのは
ブラウザのオプションに依存しているので、
それをコントロールしようというのはかなり
困難だと思います。
どうしてもというのであれば姑息で、あまり
美しくないですが、以下のような手も検討して
みてはいかがでしょうか?
<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>
No.2
- 回答日時:
直接画像を指定するのではなく、画像の表示サイズを指定した「ページ」(migi1.html migi2.html)を指定すればよいのでは?↓
【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="migi1.html" name="migi">
</frameset>
</form>
</frameset>
【list.html】
<html><head></head>
<body>
<a href="./migi1.html" target="migi">migi1</a><br><br>
<a href="./migi2.html" target="migi">migi2</a><br><br>
<a href="http://oshiete1.goo.ne.jp/images/goo.gif" target="migi">図のみ指定の場合</a>
</body>
</html>
【migi1.html】
<html><head></head>
<body>
<img src="http://oshiete1.goo.ne.jp/images/goo.gif" width=300 height=200 border=0>
</body>
</html>
【migi2.html】
<html><head></head>
<body>
<img src="http://x.goo.ne.jp/banner3/20050608/Bonolon_200- … width=300 height=200 border=0>
</body>
</html>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・一番好きなみそ汁の具材は?
- ・泣きながら食べたご飯の思い出
- ・「これはヤバかったな」という遅刻エピソード
- ・初めて自分の家と他人の家が違う、と意識した時
- ・いちばん失敗した人決定戦
- ・思い出すきっかけは 音楽?におい?景色?
- ・あなたなりのストレス発散方法を教えてください!
- ・もし10億円当たったら何に使いますか?
- ・何回やってもうまくいかないことは?
- ・今年はじめたいことは?
- ・あなたの人生で一番ピンチに陥った瞬間は?
- ・初めて見た映画を教えてください!
- ・今の日本に期待することはなんですか?
- ・集中するためにやっていること
- ・テレビやラジオに出たことがある人、いますか?
- ・【お題】斜め上を行くスキー場にありがちなこと
- ・人生でいちばんスベッた瞬間
- ・コーピングについて教えてください
- ・あなたの「プチ贅沢」はなんですか?
- ・コンビニでおにぎりを買うときのスタメンはどの具?
- ・おすすめの美術館・博物館、教えてください!
- ・【お題】大変な警告
- ・洋服何着持ってますか?
- ・みんなの【マイ・ベスト積読2024】を教えてください。
- ・「これいらなくない?」という慣習、教えてください
- ・今から楽しみな予定はありますか?
- ・AIツールの活用方法を教えて
- ・最強の防寒、あったか術を教えてください!
- ・歳とったな〜〜と思ったことは?
- ・モテ期を経験した方いらっしゃいますか?
- ・好きな人を振り向かせるためにしたこと
- ・スマホに会話を聞かれているな!?と思ったことありますか?
- ・それもChatGPT!?と驚いた使用方法を教えてください
- ・見学に行くとしたら【天国】と【地獄】どっち?
- ・これまでで一番「情けなかったとき」はいつですか?
- ・この人頭いいなと思ったエピソード
- ・あなたの「必」の書き順を教えてください
- ・14歳の自分に衝撃の事実を告げてください
- ・人生最悪の忘れ物
- ・あなたの習慣について教えてください!!
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HPの一部に他のHPを表示
-
どのページもすべて同じURLなの...
-
pythonのエラーについての質問...
-
スクロールできない
-
スタイルシートで背景画像を固...
-
WordファイルをHTMLに埋め込む方法
-
フレームの片方だけを更新(リロ...
-
フレームを使ったときに横スク...
-
フレームページへのリンクで…
-
フレームで背景画像を継ぎ目な...
-
ブラウザで4分割表示できますか?
-
CSSによるFrameの代替方法
-
ウィンドウを小さくしてもフレ...
-
同一フォルダ内の別ページの特...
-
CSSの擬似フレームでのリンク方...
-
フレームの代わり、どうしたら...
-
URLを変えないで表示する方法
-
フレームが表示されない><
-
Excelで、社外秘(閲覧のみ)と...
-
HTMLからフォルダを開きたい
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
どのページもすべて同じURLなの...
-
pythonのエラーについての質問...
-
フレームの片方だけを更新(リロ...
-
フレームを使わずに画面分割し...
-
フレームで背景画像を継ぎ目な...
-
CSSを使って画像をクリックする...
-
WebサイトでHTMLのフォームに隠...
-
Firefoxのフレーム表示について
-
フレーム分割した全体をスクロ...
-
iframeを使わないで・・・
-
html 左メニューから右への表示...
-
WordファイルをHTMLに埋め込む方法
-
ページが変わっても同じ音楽を...
-
frameの内容が表示されない
-
フレームの代わり、どうしたら...
-
フレームの幅を変更したい
-
HTML フレーム内にWebページを...
-
フレーム使用時のページの更新...
-
ワンクリックで二つのフレーム...
-
アドレスバーにトップページを...
おすすめ情報