- ベストアンサー
JavaScriptでの画像表示について
- ホームページでJavaScriptを使用して画像を表示しているが、画像が表示されない問題が発生しています。
- JavaScriptのFUNCTIONで画像を表示する際に指定方法があるのか疑問です。
- オフラインでプレビューで表示する場合は、ホームのトップページからリンクして表示すると正常に表示されます。
- maruh
- お礼率84% (49/58)
- JavaScript
- 回答数7
- ありがとう数4
- みんなの回答 （7）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (6)
- onimotsu
- ベストアンサー率36% (279/758)
<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY><SCRIPT language="JavaScript"> <!-- function doc1(){ document.open(); document.write("<html><body>"); document.write("<P></P><font color='#ffffcc'><img src='MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); document.write("</body></html>"); document.close(); } --> </SCRIPT> <INPUT type="button" name="namedoc1" value="答Click! " onclick="doc1()"> <IMG border="0" src="ya01.gif" width="12" height="11"> <FONT color="#800080"><B><U>Ｑ1．ｘｘｘｘｘｘ。？</U></B></FONT></BODY> </HTML> これで指定した画像に切り替わりますね。 とりあえず、新規ページに上記をコピー＆ペーストしてお試しください。 上記で上手く動作しないときは 'MM10.gif' を 'http://www.*****.co.jp/MM10.gif' にしてみてください。 また、画像ファイル名を再度確認しましょう。 mm10.gif なのか MM10.gif なのか。 エラーの場合、及び、エラーではないが表示されない場合にどのように表示されないのか、 例えば、「画面は切り替わるが画像が表示されない」という形で 補足しましょう。
補足
<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY><SCRIPT language="JavaScript"> <!-- function doc1(){ document.open(); document.write("<html><body>"); document.write("<P></P><font color='#ffffcc'><img src='MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); document.write("</body></html>"); document.close(); } --> </SCRIPT> <img src='MM10.gif' width='32' height='32' hspace='2'> <INPUT type="button" name="namedoc1" value="答Click! " onclick="doc1()"> <IMG border="0" src="ya01.gif" width="12" height="11"> <FONT color="#800080"><B><U>Ｑ1．ｘｘｘｘｘｘ。？</U></B></FONT></BODY> </HTML> ご指定のとうり上記を新規ページに作成して試しました。 本番のＨＰなのでアップロードは出来ませんが、開発環境で試してみましたがやはりダメでした。＜/script＞の次に置いたmm10.gifは正常に表示されます。
- onimotsu
- ベストアンサー率36% (279/758)
>FUNCTION()内で指定した画像のみが表示されないのです。 function doc1(){ document.open(); document.write("<html><body>"); document.write("<P></P><font color='#ffffcc'><img src='MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); document.write("</body></html>"); document.close(); } このように記述して MM10.gif の画像に切り替わらないということでしょうか。 <img src='MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); この部分を <img src='http://www.*****.co.jp/MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); として確認をされたのでしょうか。 >FUNCTION()内には他にページ表示編集項目があり… { や } が抜けている可能性はありませんか。 <SCRIPT language="JavaScript">～</SCRIPT>の記述を教えてもらえれば 添削できると思いますが、ただし、私には自信がありません。
補足
<img src='http://www.*****.co.jp/MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); のように指定してアップロードしてトライしましたがだめでした、エラーは起こりません。 この画像の前後に記述してある内容は全て正常に表示されます。 またＩＥでアドレス欄に ／mm10.gifと追加して移動するとその画像のみ表示できます。 ＣＡＬＬする記述は下記の通りになっています。 <INPUT type="button" name="namedoc1" value="答Click! " ONClick="doc1()"> <img border="0" src="ya01.gif" width="12" height="11"> <font color="#800080"><b><u>Ｑ1．ｘｘｘｘｘｘ。？</u></b></font> もう解りません。
- onimotsu
- ベストアンサー率36% (279/758)
では、 maruhさんのＨＰアドレスが http://www.*****.co.jp の場合には http://www.*****.co.jp/MM10.gif と指定してください。 プロバイダーのアドレスなどの場合で http://www.*****.ne.jp/maruh の場合には http://www.*****.ne.jp/maruh/MM10.gif と指定してください。 FRONTPAGEだけの動作がおかしければ FRONTPAGEに問題があると思いますが、 FRONTPAGEはHTMLを記述するためのソフトですから JavaScriptが動作しないということは 記述に問題があるのかもしれません。 また、動作はサーバーにアップロードしてＩＥで確認されているのでしょうか。 ブラウザのJavaScriptの設定を見直す必要があるかもしれません。
補足
お付き合いありがとうございます。 http://www.*****.co.jp/MM10.gif と指定して移動するとMM10.GIFの画像は確かに表示されます。 動作はサーバーにアップロードしてＩＥｖ6で確認しています。 またFUNCTION()内には他にページ表示編集項目がありそれらは全て正常に表示され動作します。ただ、FUNCTION()内で指定した画像のみが表示されないのです。
- onimotsu
- ベストアンサー率36% (279/758)
＃２のソースでページを作成、 画像はサーバーにアップロードしているものを指定して ページをサーバーにアップロードして動作確認したところでは 画像に切り替わります。 今一度、ソースを確認していただくのと 'MM10.gif'を別の画像（ファイル）で指定する、 jpegの画像を指定する、 width='32' height='32'を数値を大きくするなど お試しいただければと思います。
補足
試しましたが、やっぱりだめです。 FUNCTIONコールする側（外側）に置くと画像表示されるという事はFRONTPAGE自体に問題があるのでしょうか？（HTMLエディターはFrontpageを使用しています）。 或いは、ディレクトリー指定が必要なのでしょうか？ ／の下に全て配置していますが、かりにディレクトリー指定する場合はどの様に指定すればいいのでしょうか？教えていただければ嬉しいです。
- onimotsu
- ベストアンサー率36% (279/758)
補足ありがとうございました。 即席ですが作ってみました。(ＩＥで動作確認済み) <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- function doc1(){ document.open(); document.write("<html><body>"); document.write("<P></P><font color='#ffffcc'><img src='MM10.gif' width='32' height='32' hspace='2'><P><BR><BR>"); document.write("</body></html>"); document.close(); } --> </SCRIPT></HEAD> <BODY> <P><A href="JavaScript:doc1()">リンク</A></P> </BODY> </HTML> でも、<font color='#ffffcc'>の意味が分かりません。 また、 >画像ファイルの指定方法があるのでしょうか？ ファイルと画像が同じディレクトリに保存されていれば 'MM10.gif' で表示されると思います。
補足
早速ご回答ありがとうございます。HTMLの作成はご記述の通りに作成しています。ファイルと画像は同一ディレクトリにあります。 結局のところfunction()内で画像表示する時の指定に問題がある様に思えるのですが。 FUNCTION()の外では"MM10.gif"は表示されます。（テスト的に試しました）
- onimotsu
- ベストアンサー率36% (279/758)
え～と、質問の文法はでたらめ（失礼）に見えますね。 勿論、それでは動作しません。 何をすると画像をどのように表示したいかがわかりません。 （例えば文字をクリックするとサブウィンドウが開いて 画像を表示するとか、マウスが重なると画像を別なものに入れかえるとか） ただ単純に画像を表示するだけでしたら JavaScriptを使用する必要がないと思います。 これでいいんではないでしょうか。↓ <img src='MM10.gif' width='32' height='32' hspace='2'>
補足
当然メインのホームページで特定の項目をクリックした時にFUNCTION（）にて画面をクリアーしてから画像を表示する構造にしています。 例は解りやすくするため、簡単に作成したものです。 いずれにせよFUNCTION（）の中で画像を表示することが目的です。 宜しくお願いします。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_3_thumbnail_img_sm.png)
お礼
onimotsuさん長い間お付き合いいただきまして本当にありがとうございました。ご指摘のＮＯ7を新規に作成して画像も別の物を作り新規ページを作成しアップロードしましたところ正常に動作しました。 そこで問題のページをもう一度入念にチェックしましたところ、画像の名前が大文字でなく小文字で登録していました。本当に些細なミスでご迷惑をおかけしてもうしわけありませんでした。 はなから間違いないと思い込んでいたのは、FUNCTION()の外で使う場合は大文字でも小文字でもＯＫだった為、きずきませんでした。 FUNCTION()の中では大文字、小文字の識別と、漢字の名前は不適だと言うことのようです。（漢字の画像ファイルも使用していました） また未熟な私共にお付き合いいただいてるその中で、間接的な多くの知識をいただけたと感謝しています。 ありがとうございました。