- ベストアンサー
JavaScriptをコピペしても、、、？
以前質問したのですが、appleのサイトみたいに 再読み込みすると、一部の画像とリンク先変わる 方法はどのようにすれば、よいのでしょうか？ 上手くいきません。 同じテキスト用意して、画像貼り替えて、どちらかの テキストのヘッドに入れればいいのでしょうか？ JavaScriptに詳しい方教えてください。 http://www.okweb.ne.jp/kotaeru.php3?q=791969
- legs
- お礼率92% (1500/1623)
- JavaScript
- 回答数3
- ありがとう数3
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
#1です。 「補足」の件を考慮して、修正したものをサーバへUPしておきました。 URLは、前記と同じです。 http://www10.plala.or.jp/coffee_break/random/index.html イメージと違う分は、ご自身でJavaScriptの本など参考にして、アレンジしてみて下さい。 様々な表現方法でサイトにアクションを加えることは可能ですが、その分複雑なScriptとなってしまいます。 ご自身でメンテナンス可能な範囲で頑張ってみてください。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html;charset=shift_jis"> <title>JavaScriptサンプル 画像のランダム表示</title> <script type="text/javascript"> <!-- gazou_random = new Array(3); gazou_random[0]='<a href="setsumei_pages/setsumei1.html"><img src="toppage/1.gif"border="0"></a>'; gazou_random[1]='<a href="setsumei_pages/setsumei2.html"><img src="toppage/2.gif"border="0"></a>'; gazou_random[2]='<a href="setsumei_pages/setsumei3.html"><img src="toppage/3.gif"border="0"></a>'; setsumei = Math.floor(Math.random() * 3); //--> </script> </head> <body> <br> ページの読み込み毎にランダムに画像を表示させる一例 <br> <br> <hr> <br> <script type="text/javascript"> <!-- document.write(gazou_random[setsumei]); // --> </script> </body> </html>
その他の回答 (2)
- Joh_Taka
- ベストアンサー率76% (222/292)
#1、2です。 >でもなぜか、見れません、、、。 ? ? ? ・・。 下の「お礼」欄をコピペして、チェックしましたが、この欄に記入されている部分に関しては、こちらでは問題ありませんでした。 画像は、Appleのサイトでは圧倒的にJPEGが多く、適当なGIFが無いので、DLしたJPEG画像をPhotoshopでGIFに変換したものを使いましたが、問題ありませんでしたよ・・・。 JavaScriptの部分のみに囚われずに、もう一度、HTML全文が正しいのかも含めて、冷静になって確認してみてください。 画像ファイル自体に問題があるかもしれませんので、素材屋さんなどから、適当なGIF画像をDLして、チェックしてみては如何でしょうか？
お礼
ますます、ありがとうございます。 と言う事は、送る側の私の間違いですねぇ、、。 FTPはMAC OSXのFETCH使ってindex.htmlはテキスト、 画像はraw dataですが上げ方に問題あるかもしれません。 windowsのffftpでやってみます。まじ、そうですよねぇ、 冷静にっていうことですよね。 でもjava scriptわかる人って企業から重宝されるようです。 うらやますぅい～～～。 どうもありがとうございました。
補足
なんとなくわかってきました！ アップルサイトが外部リンクだからかもしれませんね、、。 画像を表示したい部分に下の部分を貼ると、 <script type="text/javascript"> <!-- document.write(gazou_random[ここの部分が不明]); // --> </script> なので表示できないのかもしれません。 でもどうやったらいいのかよくわかりません（笑）。 今日さっそく本や行ってきたのですが、1日.2日でできるもんじゃ ないんですね。調べたのですが、まだ、このような マニアルにでくわしてません。もうちょっと 探して頑張ってみます。
- Joh_Taka
- ベストアンサー率76% (222/292)
一つのサンプルとして、サーバへUPしてみました。 よろしければ、ご参考まで、ご覧下さい。 http://www10.plala.or.jp/coffee_break/random/index.html サンプルの中の、 gazou_random = new Array(3); は、()の中の数値は、ランダムに表示させたい画像の合計枚数が入ります。 gazou_random[0] = "toppage/1.gif"; gazou_random[1] = "toppage/2.gif"; gazou_random[2] = "toppage/3.gif"; は、画像の枚数が増えれば、それに従って gazou_random[3] = "toppage/4.gif"; の様に、[ ]の中の数値も一つずつ増やします。 n = Math.floor(Math.random() * 3); の中にある数値も、ランダムに表示させたい画像の合計数となります。 <body> ～ </body>の間、実際に画像を表示させたい場所に、 <script type="text/javascript"> <!--- random(); //---> </script> を記述します。 サイトにUPしたサンプルは、画像が3枚ですが、5枚でしたら、 <html> <head> <title></title> <script type="text/javascript"> <!--- gazou_random = new Array(5); gazou_random[0] = "toppage/1.gif"; gazou_random[1] = "toppage/2.gif"; gazou_random[2] = "toppage/3.gif"; gazou_random[3] = "toppage/4.gif"; gazou_random[4] = "toppage/5.gif"; function random() { n = Math.floor(Math.random() * 5); document.write("<img src='",gazou_random[n],"' border=0>"); } //---> </script> </head> <body> <script type="text/javascript"> <!--- random(); //---> </script> </body> </html> という感じになります。 JavaScriptでの記述は、この方法だけではありませんので、あくまでも一つの例としてご参考になれば幸いです。
お礼
しゅ、しゅごい！！ あ、ありが10ございました。 JavaScript名人でしたら、こんなのわけないんだろうなぁ、、。 でも、貴重な時間をけずってもらって恐縮しております。 おまけに、アップまでしていただき、このうえないかぎり です。世の中、捨てたもんじゃ焼きぐらいに感謝しております。 早速試してみますね！
補足
ぐぁぐぁーん早速ためしてみたのですが、ラッンダムに画像は変わりますが、変わった画像のそれぞれのリンク先ってどうやるのでしょうか？画像が変わりその画像をクリックすると次の説明へジャンプ します。また再読み込みすると、違うリンク先に変わるみたいな、、。 難しいんですかね？"toppage/1.gif";の前に<a href=～～～～～> じゃないし、、（泣）。
お礼
今日やってみました！でもなぜか、見れません、、、。 headの中に <script type="text/javascript"> <!-- gazou_random = new Array(3); gazou_random[0]='<a href="http://www.apple.co.jp/ipod/index.html"><img src="top/ipod.gif"border="0"></a>'; gazou_random[1]='<a href="http://www.apple.co.jp/ibook/index.html"><img src="top/ibook.gif"border="0"></a>'; gazou_random[2]='<a href="http://www.apple.co.jp/powermac/index.html"><img src="top/g4.gif"border="0"></a>'; setsumei = Math.floor(Math.random() * 3); //--> </script> 画像をランダムに表示させるのにはりたいところに<script type="text/javascript"> <!-- document.write(gazou_random[setsumei]); // --> </script> いれました。でもなぜか表示されません。 TOPページにレイアウトしてる同じフォルダー「top]に画像入れて リンク先をアップルのサイトにしたのですが、、。真似たつもりなんですが、、。TOP PAGEのindex.htmlは「Top」フォルダより外に出してます。道のりは険しいですね、、。なんでだろう、、。
補足
ありがとうございます！！ す、すごいですね！わざわざ、つくっていただき たすかりました。 で、でも、投稿されたの3時ってことは、サーバー 管理されてるお仕事の人なんですか？ 手に職をもってる人は強いですね。 java scriptポケット版買ってみます！ できるかどうかわからないですけど、、、（笑）。 でも、きっと、誰でもできないところからスタートするんだろうな と思い、少し反省しました。htmlまでは作った事あるので、 ここまでして作っていただき感謝しております。 ありがとうございました。