- ベストアンサー
ホームページの写真表示について
IE6.0を使用しています。 ホームページの作成で 写真を<img src=***.jpg>で表示すると、 大きい画像の場合、縮小表示され、矢印で原寸大にするようになっています。 しかし、この縮小表示の輪郭が汚いので、最初から原寸大表示にしたいのですが、する方法はありますか。 （別に写真表示用htmlファイルを作ればできますが、写真直リンクでできるかどうか知りたいです。）
- noro6857
- お礼率88% (526/596)
- Windows XP
- 回答数7
- ありがとう数5
- みんなの回答 （7）
- 専門家の回答
質問者が選んだベストアンサー
>最初のhtmlファイルになにか策をたてられるかどうかがわかるとありがたいのですが。 １つのhtmlだけで表示させようとするには、元の写真「***A.jpg」の情報（***Aと縦横サイズ）を受け渡さないと無理ですね。 受け渡すにはやはりJavaScriptを使わないと無理です。 また、ブラウザとWindowsの制約から、はじめから原寸は無理で、最大閲覧者のディスプレイのサイズ（1024x765とか1280x1024）止まりで、それ以上のサイズの写真はディスプレイサイズに縮小表示され「○にプラスのマーク」を表示します。クリックするとスクロールバー付き原寸表示になります。 この方法を書いておきます。 元のhtmlファイルで </head>の直前に以下のJavascriptのプログラムをおいて(貼り付けて)ください。 ---ここから--- <script language="JavaScript"><!-- var pname;function img_sc(nam){pname=nam;myphoto=new Image();myphoto.src=nam+".jpg";} function win_op(){if(myphoto.complete){x=myphoto.width+20;y=myphoto.height+30;window.open(myphoto.src,pname,"menubar=no,scrollbars=yes,resizable=no,width="+x+",height="+y);}} //--></script> ---ここまで--- <body>以降の本文中に写真ごとに以下のように書いてください。ただし、「***An.jpg」の拡大写真を「***Bn.jpg」とします。(n=1～200枚） 写真1枚目： <br> <a href="javascript:void(0);" onmouseover="img_sc('***B1');" onclick="win_op();" title="拡大表示"> <img src="***A1.jpg"></a><br> 写真2枚目： <br> <a href="javascript:void(0);" onmouseover="img_sc('***B2');" onclick="win_op();" title="拡大表示"> <img src="***A2.jpg"></a><br> 以下この繰り返しです。 拡大画像用htmlファイルは自動的に開きますので、htmlファイルは作成する必要はありません。 以上試してみてください。
その他の回答 (6)
- info22
- ベストアンサー率55% (2225/4034)
画像をhtmlファイルと同じディレクトリに置く方法で上手く表示されているとのことですが、それでよろしいですか？ Windowsではデスクトップのサイズより大きなウインドウズは開けない制約やブラウザの制約のため現状で良しとせざる得ないと思います。 なお、こちらで下記の2つ●の場合について実際にサンプルを作ってうまく動作することを確認して回答していますのでどちらでも上手くいくはずです。 ●画像をhtmlファイルの下の「img/」に置いて大きい画像と小さい画像の名前の前に「img/」をつけた場合も ●画像をhtmlファイルと同じフォルダ（ディレクトリ）に置いて大きい画像と小さい画像の名前の前に「img/」をつけない場合 >画像ファイルをimgにいれずにhtmlファイルと同じフォルダにして、記述からimg/をはずしてみたらうまく表示されました。 どちらのケースでも動作確認済みです。 >別フォルダにいれるとうまくゆかないのかもしれませんね。 別フォルダでも動作確認済みです。おかしいですね。 タグや「"」が１つでも過不足のミスがあると、表示画面に、htmlの中の記述は無効になったり、表示画面に出てしまうことが起きます。 >なおscript内のjpgは大文字、小文字関係なく表示できました。 これはMicrosoftの「MS DOS」やそれを引き継いだ「Windows OS」のいい加減なところです。http://www.xxx..../ の記述文字も大文字、小文字を区別していませんね。 UNIXのように大文字、小文字を区別しているとはっきり区別できます。 >最初両方にimg/6039…としたのですが、画像をクリックしたときに下の方に <１>三角のはてなマークとjavascript:void(0) が出てしまったため、 >大きい方はjava記述の仕組みかと思ってはずしました。 <２>はずすとはてなマークが消えたものですから。 <３>もう一度imgをいれてみましたが、しかし大きい画像はどうしても表示できません。 <1>この辺りに貼り付けミスがある可能性が高いです。 貼り付ける範囲の不足か または 貼り付ける前の文字列が残ってしまった。 貼り付ける場合や変更する場合の 「<」と「>」のタグの数の過不足 「"文字列"」の「"」の過不足 が原因しているようです。大文字、小文字の使い分けがいい加減の割りに、タグや「"」の数の過不足は1つだけでも致命的な影響を与えますね。
お礼
テストまでしていただいて恐縮です。 何回かチェックしているんですが、おかしいですね… やはりimgの中に画像は納めたいのでなんとかうまくゆきたいです。 実際にUPしてあるurlをご紹介します。 http://sr777.com/photo2004/050326fusae/index.html の6039の部分です。 画像の拡張子は本文にあわせて小文字にしました。 クリックすると一瞬「エラー」となり、はてなマークが出たままです。 IE6.0 OSはXpHomeを使用しています。
- info22
- ベストアンサー率55% (2225/4034)
No.4は削除してください。 サーバが混んでいたせいかNo.5の一部が分割されUPされてしまいました。
- info22
- ベストアンサー率55% (2225/4034)
>ふと気がついたことは画像のファイルNoが順列でないといけないのかなと思いました。 小さい画像Aと大きい画像Bが対応していて、それがn=200組あるということだけです。要は小さい画像をクリックしたとき、それに対して大きい画像が表示されるという関係だけです。番号は説明のためだけですから、実際の画像ファイルの名前の番号とは関係がありません。 ●うまくいかない原因 HTMLファイルのあるフォルダ（ディレクトリ）の下の「img/」に小さい画像と大きい画像が置かれているため、以下のように、両方とも前に「img/」をつければ、うまくいきます。 <a href="javascript:void(0);" onmouseover="img_sc('img/IMGP6039');" onclick="win_op();" title="拡大表示"> <img src="img/IMGP6039s.JPG"></a><br>
お礼
たびたびすみません。 最初両方にimg/6039…としたのですが、 画像をクリックしたときに下の方に 三角のはてなマークとjavascript:void(0) が出てしまったため、大きい方はjava記述の仕組みかと思ってはずしました。はずすとはてなマークが消えたものですから。 もう一度imgをいれてみましたが、 しかし大きい画像はどうしても表示できません。 headの中に書く scriptの中に「jpg」と書かれている部分があるので、ファイルの拡張子が大文字のため、ここも大文字にしてみたのですが、小文字、大文字とも変化なかったです。 scriptはペーストしているためスペルミスは発生してないと思います。 あと、まだできてはいませんが、小画像表示の輪郭を消すためにborder=0を記述してしまってもいいですよね？
補足
画像ファイルをimgにいれずにhtmlファイルと同じフォルダにして、記述からimg/をはずしてみたらうまく表示されました。 別フォルダにいれるとうまくゆかないのかもしれませんね。 なおscript内のjpgは大文字、小文字関係なく表示できました。
- info22
- ベストアンサー率55% (2225/4034)
HTMLファイルのあるフォルダ（ディレクトリ）の下の「img/」に小さい画像と大きい画像が置かれているため、以下のように、両方とも前に「img/」をつければ、うまくいきます。 <a href="javascript:void(0);" onmouseover="img_sc('img/IMGP6039');" onclick="win_op();" title="拡大表示"> <img src="img/IMGP6039s.JPG"></a><br>
- info22
- ベストアンサー率55% (2225/4034)
><A href="***B.jpg"><img src=***A.jpg></A> とした場合で***.A.jpgは実サイズ表示サイズともは320×240とし、***B.jpgは実サイズ3200×2400にした場合そのまま表示したいのです。 特別な技術を使わないで、最も簡単には 元のHTMLファイルで <A href="***B.html"><img src=***A.jpg></A> としておき 拡大画像用htmlファイル「***B.html」を作り その中に <IMG src="***B.jpg" width="3200" height="2400" border="0"> とすればいいかと思います。 これではだめですか？ （そうでないとJavascriptなどを使って同様な操作をすることになるかと思います。）
お礼
ありがとうございます。 最初の質問にも書いてあるように表示用htmlで作ることは知っているのですが、写真のみにリンクさせて、最初のhtmlファイルになにか策をたてられるかどうかがわかるとありがたいのですが。 （写真がたくさんあり(200枚近く）それをひとつずつhtmlファイルを作るのがめんどうなため）
- info22
- ベストアンサー率55% (2225/4034)
>写真を<img src=***.jpg>で表示すると 原寸が640x320の場合、以下のように書けば、最初から原寸で表示されませんか？ <IMG src="***.jpg" width="640" height="320" border="0"> 結果をお知らせください。
お礼
ありがとうございます。 質問の記述を間違えました。 <A href="***.jpg">写真</A> とした場合、このクリック先の写真表示を最初から原寸大にしたいのです。 ふつうは縮小表示され、拡大矢印記号が出てそれにより拡大するようになっていると思います。
補足
下記文でもう少し正確に書きます。 <A href="***B.jpg"><img src=***A.jpg></A> とした場合で***.A.jpgは実サイズ表示サイズともは320×240とし、***B.jpgは実サイズ3200×2400にした場合そのまま表示したいのです。（当然画面からはあふれますが）
関連するQ&A
- ホームページにPDFを表示させる
こんにちは、 過去の質問でも検索したのですが、 希望する質問＆回答が検索できませんでしたので、 教えてください。 ホームページに画像データ（JPG）やリンクでPDFを表示させる式はなんとなく分かったのですが、 画面上に直接PDFを表示させる式を教えてください。 ホームページ作成は初心者です。 基本的な質問で申し訳ありませんがお願いします。 リンクの式は、 <a href="/○○○○/gazou1.pdf" target="_blank">リンク</a> 画像を貼り付ける式は、 <img src="/○○○○/PDFgazou.jpg" alt="内容" width="900" height="1000" border="0">
- ベストアンサー
- その他（インターネット・Webサービス）
- ホームページの画像が表示されません
アマゾンの書籍を自分のホームページで宣伝しようと思い、書籍の画像をtest.jpgという名前を付けて保存し、ホームページの中でHTMLで<img src="test.jpg" />としたのですが、表示されません。 この画像そのものは、トリミングなどの編集は自由にできます。 また、test.jpgの部分を他の写真に置き換えてtest2.jpgとすると、他の写真ならちゃんと表示されます。 どなたか、対処方法をご存じの方はいらっしゃいませんか？
- 締切済み
- HTML
- ホームページに写真が表示されない
すみません、ホームページ作成初心者です。 ホームページテンプレートをコピーしてきて そこに貼ってあったサンプル画像(*.jpg)をさしかえようと したのですが、うまくいきません。 （×マークが表示されてしまいます。） 差し替えようとした写真は*.JPGだったので *.jpgにリネームしてhtmlに記入しました。 わかりましたらよろしくお願いします。 なお、差し替えの写真もサンプル画像と同じ場所に置きました。 なのでパス指定は変えていません。
- ベストアンサー
- その他(ソフトウェア)
- HPの画像の拡大表示について
現在ＨＰを作成しています。 小さい画像を並べて、クリックすると新しいウインドウに 拡大写真が表示されるようにしたいのですが。 winのペイントで画像を２枚用意して、(縮小画像と拡大画像) 01と１にファイルしました。 <A href="img\1.jpg" target="_blank"><IMG src="img\01.jpgL"></A> としたのですが、拡大画像は表示されても、縮小画像は×になっています。何か間違っているのでしょうか? 教えてくださいお願いします。 超初心者ですので、わかり易くお願いします。
- ベストアンサー
- HTML
- ホームページに画像が表示されません
Windows XPでホームページを作成中なのですが、画像を１つも表示することができまず困っています。 以下のように作成しました。 ・マイ ドキュメント＞Home Page の中にメモ帳で作成したページを .htm で保存しました。（<img src="1/g.JPG">と<body>に書きました） ・画像をマイ ドキュメント＞Home Page＞1 の中に g.JPG で保存しました。 ・２つともFFFTPでアップロードをしました。 無料ホームページを使用せずにマイ ドキュメントからページを表示すると画像は載っているのですが、FFFTPで開くと×になってしまいます。 なぜホームページ上では表示されないのか分からず困っています。 よろしくお願いします。
- ベストアンサー
- Windows XP
- ホームページに写真の貼り付け方
初めてホームページを作成していてつまずいてしまいました。 写真を50枚ほど貼り付けて、クリックしたら写真の拡大が出るという形のものを作りたいのですが、いい方法ありましたら教えてください。 現在は <TABLE> <TR> <TD><A HREF="写真の場所.JPG"><IMG SRC="写真の場所.JPG" WIDTH="120" HEIGHT="120"></A></TD> <TD> ・・・・ </TD> </TR> </TABLE> という具合にテーブルに写真を入れて作ってるのですが、写真の表示速度が非常に遅いのと、途中から写真が10～15枚目（コンピュータを起動した毎に違う）から写真が表示されなく枠組みだけが表示されるようになってしまいます。(枠組みの左上に×が表示されています。） よろしくお願いします。
- ベストアンサー
- HTML
- ホームページ。写真が映りません。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ setInterval(function(){ $('.blink').fadeOut(1200, function(){$(this).fadeIn(200)}); }, 1400); }); </script> <img src="/img/4673.jpg" "/img/8040.jpg""/img/8006.jpg""/img/2582.jpg" "/img/6920.jpg""/img/0036.jpg""/img/1943.jpg""/img/0840.jpg""/img/0127.jpg" "/img/3783.jpg""/img/9118.jpg""/img/9365.jpg""/img/4392.jpg" "/img/6805.jpg" "/img/9374.jpg" "/img/7303.jpg" "/img/3879.jpg""/img/5934.jpg""/img/9364.jpg"alt="" width="990" height="660" class="blink"> http://klutche.org/archives/1612/ いつも教えて下さり有難うございます。 上記URLを見て、JavaScriptを試したのですが、１つの写真サイズでフラッシュさせるには？ のつもりが、990*660が１０枠以上出てきましたので、上記のような不自然なJavaScriptになりました。 １番の疑問点が写真ファイルの置くところです。 ワタシはUbuntu16.04で/var/www/htmlの下に置いてます。 ホームページも同じ場所です。 全く映りません。 写真ファイルはどのように置くべきですか？ ご回答の程、宜しくお願い申し上げます。
- ベストアンサー
- ハードウェア・サーバー
- ホームページの画像が表示されない
宜しくお願いします。 忍者ホームページの簡単ホームページでホームページを作りましたが画像が表示されず コメントだけの表示に成ります。 忍者ホームページにアップロードした画像ファイル名は一致しております 幾度試しましたが同じ状態です 下記のHTMLは間違って居りますでしょうか困って居ります <table align="right"> <tr><td><img src="img142.jpg"width="250" height="250"></td> <td><img src="img004.jpg"width="250" height="250"></td></tr> <tr align="center"><td bgcolor="#ffcccc">ハイブリットフリウス</td> <td bgcolor="#66cc66">フーガハイブリット</td></tr> <tr><td><img src="img013.jpg"width="250" height="250"></td> <td><img src="img889.jpg"width="250" height="250"></td></tr> <tr align="center"><td bgcolor="#cc9900">ポルシェカレラ</td> <td bgcolor="#9999cc">フェラリーモンディアル</td></tr> </table>
- ベストアンサー
- その他([技術者向] コンピューター)
- firefoxで表示される画像がIEで表示されない
同じHTML内に <img src="images/9.jpg" alt=""商品画像 /> と <img src="images/title_1.gif" /> がありますが firefoxでは上記の画像を含めすべての画像が表示されますが IEでは <img src="images/title_1.gif" />は表示されるが <img src="images/9.jpg" alt=""商品画像 />は 表示されません。 なぜか判りません。 原因がまったくわかりません。 教えてください。よろしくお願いします。
- ベストアンサー
- HTML
- 忍者簡単ホームページの画像が表示されない
宜しくお願いします。 忍者ホームページの簡単ホームページでホームページを作りましたが画像が表示されず コメントだけの表示に成ります。 FFFFTPとかホストとか効きますが一度も利用したことが有りません HTMLはメモ帳で作成し画像は同じパソコンのデスクトップにフォルダーとして保存しております。 忍者ホームページにアップロードした画像ファイル名は一致しております 幾度試しましたが同じ状態です 下記はいま利用中のURLです宜しくお願いします。は間違って居りますでしょうか困って居ります http://qqai54.dousetsu.com/simpleVC_20110710164243.html ここはテーフルタグです。 <table align="right"> <tr><td><img src="img142.jpg"width="250" height="250"></td> <td><img src="img004.jpg"width="250" height="250"></td></tr> <tr align="center"><td bgcolor="#ffcccc">ハイブリットフリウス</td> <td bgcolor="#66cc66">フーガハイブリット</td></tr> <tr><td><img src="img013.jpg"width="250" height="250"></td> <td><img src="img889.jpg"width="250" height="250"></td></tr> <tr align="center"><td bgcolor="#cc9900">ポルシェカレラ</td> <td bgcolor="#9999cc">フェラリーモンディアル</td></tr> </table>
- ベストアンサー
- その他([技術者向] コンピューター)
お礼
大変丁寧な回答をいただき感謝します。 さっそく試させていただきました。 ふと気がついたことは画像のファイルNoが順列でないといけないのかなと思いました。 当該ファイルの内容を更に説明しますと、 フレームを使用し、左側にメニュー相当のサムネイル画像を並べてあります。 そしてそれをクリックすることで右側主画面のhtmlファイルが表示されます。（画像枚数分のhtmlファイル） そのhtmlファイルの内容は次のとおりです。 <TABLE BORDER="0" WIDTH="640"> <TR> <TD WIDTH="30%" ALIGN="LEFT"><A HREF="IMGP6025.html"><< 前の画像</A></TD> <TD WIDTH="40%" ALIGN="CENTER"><img src=fusae1.gif></TD> <TD WIDTH="30%" ALIGN="RIGHT"><A HREF="IMGP6044.html">次の画像 >></A></TD> </TR> </TABLE> </P> <!-● <A HREF="img/IMGP6039.JPG" target="_blank"> <IMG SRC="img/IMGP6039s.JPG" BORDER="0" HEIGHT="450" ALT="IMGP6039.JPG"> </A> --●> ここで表示画像(6039s.JPG)(320×450)をクリックすると、別の大画像6039.JPG(960×1350)が表示されるのですが、その画像が最初は小さいためダイレクトに原寸大で表示する方法を模索中なのです。 ご覧のように画像は次の画像のNoは順列ではありません。 とりあえずご指示いただいた。 headの中にscriptを記述し、 <!-● から --●> を <a href="javascript:void(0);" onmouseover="img_sc('IMGP6039');" onclick="win_op();" title="拡大表示"> <img src="img/IMGP6039s.JPG"></a><br> と置き換えてみたのですが…。 記述が正しくないのかうまくゆきませんでした。