• ベストアンサー

ホームページに写真の貼り付け方

初めてホームページを作成していてつまずいてしまいました。 写真を50枚ほど貼り付けて、クリックしたら写真の拡大が出るという形のものを作りたいのですが、いい方法ありましたら教えてください。 現在は <TABLE> <TR> <TD><A HREF="写真の場所.JPG"><IMG SRC="写真の場所.JPG" WIDTH="120" HEIGHT="120"></A></TD> <TD> ・・・・ </TD> </TR> </TABLE> という具合にテーブルに写真を入れて作ってるのですが、写真の表示速度が非常に遅いのと、途中から写真が10~15枚目(コンピュータを起動した毎に違う)から写真が表示されなく枠組みだけが表示されるようになってしまいます。(枠組みの左上に×が表示されています。) よろしくお願いします。

  • kkk68
  • お礼率76% (86/113)
  • HTML
  • 回答数3
  • ありがとう数3

質問者が選んだベストアンサー

  • ベストアンサー
  • mrkk
  • ベストアンサー率31% (46/144)
回答No.1

画像をHEIGHT、WIDTHで縮小しても重さ自体は変わらない上、綺麗ではないので オススメしません。 画像加工が出来るソフトで、あらかじめ縮小した画像をサムネイルに使ってはどうでしょうか? <A HREF="写真の場所.JPG"><IMG SRC="縮小済みの写真の場所.JPG"></A> といった感じです。

kkk68
質問者

お礼

確かにきれいではなかったです。 おかげさまで解決しました。ありがとうございました。

その他の回答 (2)

  • Mozisan
  • ベストアンサー率43% (130/299)
回答No.3

> という具合にテーブルに写真を入れて作ってるのですが、 > 写真の表示速度が非常に遅いのと、 これはすでに回答があるように、縮小画像を作れば解決します。 > 途中から写真が10~15枚目(コンピュータを起動した毎に違う)から > 写真が表示されなく枠組みだけが表示されるようになってしまいます。 > (枠組みの左上に×が表示されています。) 画像の場所が間違っていると「X」が表示されます。 でも、今回のケースでは画像サイズが大きいようなので、 画像ファイルのダウンロードに時間がかかり、タイムアウトしている ように思います。 であればアクセスするたびに、「X」が付く画像減っているはずですし、 「X」画像を右クリックし「画像の表示」を選ぶと表示されるではないかと思います。

kkk68
質問者

お礼

画像の場所が違うと×が表示されるんですね。 参考になりました。ありがとうございました。

  • timber
  • ベストアンサー率29% (218/739)
回答No.2

これだとテーブルの中にフルサイズの画像を縮小表示しているだけなので 表示するのにすべての画像を読み込まねばならず非常に時間がかかります。 表示されない画像は時間切れなのでしょう。 こういう場合普通は拡大表示用の画像ファイルの他にサムネイル表示用の 小さなサイズの画像ファイルを作成しておき、そちらをメニュー用に使います。 画像の縮小方法についてはここでも何度も質問されてますので ここでは回答しません、検索してみてください。

kkk68
質問者

お礼

そのとおりでした。ありがとうございました。

関連するQ&A

  • 助けてください><IE上で1pxのズレ

    こんにちわ。 組んだテーブルに謎の1pxがはいってしまいます。 ファイヤーフォックスでは正常なのですがIEでは1pxの隙間ができてしまうようで。 どなたか分かる方いらっしゃたらお願いします>< <table width="660" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="2" valign="top"> <img src="img/test_01.jpg" width="660" height="177" alt=""></td> </tr> <tr><td rowspan="2" valign="top"> <table width="316" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="2"> <img src="img/test_02.jpg" width="316" height="46" alt=""></td> </tr> <tr> <td> <img src="img/test_05.jpg" width="144" height="47" alt=""></td> <td> <img src="img/test_06.jpg" width="172" height="47" alt=""></td> </tr> <tr> <td colspan="2"> <img src="img/test_08.jpg" width="316" height="169" alt=""></td> </tr> </table> </td></tr> <tr><td valign="top"> <table width="344" border="0" cellpadding="0" cellspacing="0"> <tr><td> <table width="344" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <img src="img/test_03.jpg" width="181" height="62" alt=""></td> <td> <img src="img/test_04.jpg" width="163" height="62" alt=""></td> </tr> <tr> <td colspan="2"> <img src="img/test_07.jpg" width="344" height="83" alt=""></td> </tr> </table> </td></tr> <tr><td> <table width="344" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <img src="img/test_09.jpg" width="160" height="62" alt=""></td> <td> <img src="img/test_10.jpg" width="184" height="62" alt=""></td> </tr> <tr> <td colspan="2"> <img src="img/test_11.jpg" width="344" height="23" alt=""></td> </tr> <tr> <td> <img src="img/test_12.jpg" width="160" height="32" alt=""></td> <td> <img src="img/test_13.jpg" width="184" height="32" alt=""></td> </tr> </table> </td></tr> </table> </td></tr> <tr><td colspan="2"> <table width="660" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="5"> <img src="img/test_14.jpg" width="660" height="141" alt=""></td> </tr> <tr> <td> <img src="img/test_15.jpg" width="130" height="150" alt=""></td> <td> <img src="img/test_16.jpg" width="130" height="150" alt=""></td> <td> <img src="img/test_17.jpg" width="140" height="150" alt=""></td> <td> <img src="img/test_18.jpg" width="130" height="150" alt=""></td> <td> <img src="img/test_19.jpg" width="130" height="150" alt=""></td> </tr> <tr> <td colspan="5"> <img src="img/test_20.jpg" width="660" height="40" alt=""></td> </tr> </table> </td></tr> </table>

  • ホームページの画像が表示されない

    宜しくお願いします。 忍者ホームページの簡単ホームページでホームページを作りましたが画像が表示されず コメントだけの表示に成ります。 忍者ホームページにアップロードした画像ファイル名は一致しております 幾度試しましたが同じ状態です 下記の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>

  • <td> 内のテーブルを上寄せにするには?

    すみません教えていただけますか? 初心者です。 このまま表示するとTABLE A の直ぐ下のテーブルが中央に来てしまいます。 上寄せにしたいのですが、どのようにすればよいでしょうか? よろしくお願いします。 <table width="960" border="1"> <tr> <td width="160"> <!-- TABLE A --> <table width="160" border="1"> <tr> <td> <a href="" ><img src="subMenu.gif" /></a> </td> </tr> <tr> <td> <a href="" ><img src="subMenu.gif" /></a> </td> </tr> <tr> <td> <a href="" ><img src="subMenu.gif" /></a> </td> </tr> <tr> <td> <a href="" ><img src="subMenu.gif" /></a> </td> </tr> <tr> <td> <a href="" ><img src="subMenu.gif" /></a> </td> </tr> </table> </td> <td width="800" height="1200" border="1"> &nbsp; </td> </tr> </table>

    • ベストアンサー
    • HTML
  • 写真の下に説明文

    こんにちは。 今アルバムのページを作っています。 右側に縮小した写真を縦に並べ、その写真をクリックすると画面中央に拡大されて映るというものです。 拡大された時、写真の簡単な説明文を写真の下に表示させたいんですが、やり方がわかりません。検索してみたんですが、それらしき物が見つからずこちらに参りました。 だいぶ略してますが、下記のようなソースを使って作りますよね?これで、中央に表示させるまでは出来ました。後は各写真の説明文の表示だけなんです。 <script type="text/javascript"> <!-- var img01 = "../photoothers/stamp.jpg"; function startimg(I){  document.image.src=I;  } //--> </script> =中略= <table> <tr> <td align=center> <table border =1> </td> </tr> <tr> <td align=center> <img src="../gif/●.jpg" name="image"> </td> </tr> </table> </td> <td> <table align=right"> <tr> <td align=center> <a href="javascript:startimg(img01)"> <img src="../gif/●.jpg" width="130" height="100"></a> </td> </tr> </table> </td> </tr> </table> 宜しくお願いします。

  • ページ上部にスペースが空いてしまう・・・

    今ショッピングモールに出店するために素人ながらページを作っているんですが、ヘッダーの部分の上にスペースがどうしても空いてしまっていていて、修復できません・・・・。モールの方に聞いてみたところ「閉じるタグが抜けている・・」等の答えが返ってきたのですが、それ以上は教えてくれませんでした。。いろいろ調べてみたのですが、どうしても分かりません。。どうかよろしくお願いいたします。 ↓まだ作成途中なので変な箇所があるかもしれません・・。 <table class="head" bouder> <tr> <td class="head"> <img src="gazou" width=600 height=130 alt=""> <tr> <tr align="right"valign="middle"><br> <tr> <td width="713" height="35"> <table width="0" border="0" cellpadding="0"> <tr><td width="32%"><img src="gazou" width="200" height="8"></td> <td width="0%"><a href="~.html"><img src="gazou" width="108" height="25"border="0"></td> <td width="16%"><a href="~html"><img src="gazou" width="107" height="27"border="0"></td> <td width="16%"><a href="~html"><img src="/lib/shidagoromo/puraa" width="108" height="27"border="0"></td> <td width="16%"><a href="~.html"><img src="gazou" width="107" height="27" border="0"></td> <td width="20%"><img src="gazou" width="107" height="28"border="0"></td> </tr> </table> </td> </tr> よろしくお願いします。

    • ベストアンサー
    • HTML
  • ホームページの<TABLE>の簡易的な方法について

    ホームページ作成で写真をサムネールで表示し、クリックすると大きなサイズを表示する 簡便な方法について教えて下さい 今は、メモ帳で下記の様な記述を1枚1枚記入して作成しています これを、アプリで写真の配置で自動的に登録させるようなものがありますか? 毎回ホームページを作成する都度行うのも大変なので・・・ 写真を大小用意しておいて、レイアウトにはめるだけでできる様なものがあると良いのですが なにかありませんでしょうか? <TABLE> <TR> <Td>テスト</td> <Td>テスト</td>  ・  ・ <Td>テスト</td> </TR> <TR> <TD><a href="2002\large02/(サイズ大).jpg"><IMG src="2002/before/(サイズ小).jpg"></a></td> <TD><a href="2002\large02/(サイズ大).jpg"><IMG src="2002/before/(サイズ小).jpg"></a></td>  ・  ・ <Td><a href="2002\large02/(サイズ大).jpg"><IMG src="2002/before/(サイズ小).jpg"></a></td> </TR> </TABLE>

  • 忍者簡単ホームページの画像が表示されない

    宜しくお願いします。 忍者ホームページの簡単ホームページでホームページを作りましたが画像が表示されず コメントだけの表示に成ります。 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>

  • 別フレームにJPG画像をhtmlページ無しでセンターに表示する方法

    宜しく御願いします。 ページをフレームで縦切り2分割にして、左フレームの画像をクリックすると 右フレームに、画像が大きく表示されるホームページを作っていますが、 右フレームに表示される画像が左上寄りになります。 右フレームに表示される画像を、htmlページを用いて表示すれば センターに出来ることは判っているのですが、JPG画像のみの表示で センターにする方法はあるのでしょうか。 左フレームのソースは以下のような物です。 ******************************* <TABLE width="204"> <TR> <TD nowrap><A href="a.jpg" target="sub"><IMG src="as.jpg" height="100" width="75"></A></TD> <TD nowrap></TD></TR> <TR> <TD nowrap></TD> <TD nowrap><A href="s.jpg" target="sub"><IMG src="ss.jpg" height="75" width="100"></A></TD></TR> <TR> ******************************** 以下省略 ご存じの方、宜しく御願い致します。

    • ベストアンサー
    • HTML
  • 画像のサムネイルを縦横ともに指定した数値以内で表示したい。

    いままで画像を縦横比を維持して表示するには、縦一方の大きさを指定してたのですが これだと横長の画像を多く並べる場合デザインが大きく狂ってしまいます…。(どんどん横に広がってしまいます) googleやpixivのように縦横整えて表示させたいのですが、やり方が分かりません。どのようにすればよいのでしょうか。 イメージとしてはこんな感じです。 ・130ピクセルx130ピクセルの枠の中に縦横比を維持した画像を表示させる。 ・その枠を横に四つ並べる。 (縦長の画像は極端に縦長に表示され、横長の画像は極端に横長に表示されるということです。) 各画像の表示例は、例えばgoogle画像検索やpixivなど。 →google画像検索 http://images.google.co.jp/images?hl=ja&safe=off&q=%E3%83%91%E3%83%8E%E3%83%A9%E3%83%9E&lr=&um=1&ie=UTF-8&sa=N&tab=wi →pixiv http://www.pixiv.net/search.php?word=%E6%BC%AB%E7%94%BB&s_mode=s_tag ---いままで使ってたソース--- <table width="80%"> <tr align="center"> <td><a href="001.jpg"><img src="001.jpg" border="0" height="130"></a></td> <td><a href="002.jpg"><img src="002.jpg" border="0" height="130"></a></td> <td><a href="003.jpg"><img src="003.jpg" border="0" height="130"></a></td> <td><a href="004.jpg"><img src="004.jpg" border="0" height="130"></a></td> </tr> <table width="80%"> <tr align="center"> <td><a href="005.jpg"><img src="005.jpg" border="0" height="130"></a></td> <td><a href="006.jpg"><img src="006.jpg" border="0" height="130"></a></td> <td><a href="007.jpg"><img src="007.jpg" border="0" height="130"></a></td> <td><a href="008.jpg"><img src="008.jpg" border="0" height="130"></a></td> </tr> ---ここまで--- こんなソースを使ってました。 教えてください、よろしくお願いします。

    • ベストアンサー
    • HTML
  • 写真集の写真を別窓で大きく表示したいのです

    写真集の写真を別窓で大きく表示したいのですが、 クリックしてもそのままの同サイズでしか別窓で表示されません。 大きく拡大した写真を表示したいのですが このタグでどこがいけないのでしょうか? アドバイスよろしくお願いします!   <tr> <td align="center" valign="middle" width="128" height="128"><A href="s-d11900251.jpg" target="_blank"><IMG src="s-d11900251.jpg" border="0" width="160" height="120"></A></td>

    • ベストアンサー
    • HTML

専門家に質問してみよう