- ベストアンサー
Java Scriptで作ったhtml形式の壁紙をgif形式に・・
ホムペの無料素材屋さんの所の「壁紙」の所に 『動く壁紙』としてJava Scriptで作られてると思う壁紙を gif形式で置いてられる所を見た事があるのですが、 あれはやはりJava Scriptの専門的な知識が無いと作るのは無理なのでしょうか？(^^; 本などの付録のCD-RからダウンロードしたJava Scriptの壁紙を、html方式で確認して見る事が出来るのですが・・・確かgif方式にしないと壁紙として使う事が出来ないッて聞いた事があるのですが・・・、これをどう言う風にgif方式に変えたら良いのか・・どうしても解りません。 名前を書き換えて保存する時に「拡張子」を変えるだけではダメみたいですし・・・、やっぱりソースからの書き換えがしつようなのでしょうか？ ちなみに関係無いのか解りませんが、僕のPCは Windows Meを使っています。
- otoyanns
- お礼率100% (8/8)
- JavaScript
- 回答数6
- ありがとう数10
- みんなの回答 （6）
- 専門家の回答
質問者が選んだベストアンサー
またまた失礼します。どうやら今回の壁紙とは、アニメーションＧＩＦではなくて、Java Scriptによるものですね。m(__)m 今回のJava Scriptによる壁紙は、羽根などの画像ファイルを動かしたりするプログラムのために、Java Scriptというスクリプト言語で動きを実行しているので、全体としては画像ファイルではないので壁紙ではないのです。（要は、壁紙のようにしていると言ったところでしょうか。） また、今お使いのＨＰ作成ソフトでもJava Scriptによる壁紙を使うことができます。 まず作りたいＨＰをソフトで（本文を書いたり、貼りたい画像を入れたりして）作成し、できたhtmlファイルを開きそこで右クリックの『ソースを表示』を選択して、下記のJava Scriptソースを<BODY>タグの後にカット＆ペースとで書きこみ、html拡張子で保存すればご希望のＨＰができると思います。 htmlのタグやJava Scriptは、すぐに覚えることができますよ。（僕は夏休みを使って覚えました。） また何か質問がありましたらお気軽にどうぞ。 それでは！！
その他の回答 (5)
- sinisa
- ベストアンサー率41% (5/12)
どうも～。期待どうりのホムペができてよかったですね。 それで、ホムペの差し替えですが、そのままＦＴＰソフトで古いファイルを削除するか、消したくなかったら別のフォルダにでも置いといたりします。次に、新しいhtmlファイル等を転送します。そのとき、だいたいのサーバーが初めに表示するホムペのファイル名を"index.html"にしていると思いますので、名前を変えて転送します。 もしも、今のホムペが"index.html"でなければ、新しいホムペをこのファイル名にしとけば大丈夫だと思います。（このへんは、だいたいのことしか分かりませんが） また、別のJava Scriptですが一緒に書き加えても基本的には大丈夫だと思いますが、たまにうまく作動しない場合もあるかもしれません。その辺は、対処はJava Scriptがすこし書けるぐらいでないと難しいです。 ホムペに関する情報源として、『とほほのＷＷＷ入門』が結構定番のサイトですよ。 他の自分の持っている知識としては、カウンタや掲示板などは自分で作るのは、Java Scriptよりも難しいと思うので（僕はＣＧＩをまだ使ったことがないので・・・）、無料で貸し出し？ているところもたくさんありますよ。 かっこいいホムペでは、FlashやShockwave等の技術をつかってます。絵が変化する画像（アニメーションＧＩＦ）とか、音楽を流すなどもいいですよ。 こういったものには知識と技術が必要なので、なれてきたころに始めればいいと思います。 それではー！！
お礼
本当に解り易く説明頂きありがとうございます。（大感激） sinisaさんのお陰で、Java Scriptの事も壁紙の事も大変良く理解する事が出来ました。(^^) あとは、sinisaさんから教えて頂いた『とほほのＷＷＷ入門』等、ホムペが勉強出来るサイトで、ホムペ勉強をして行きたいと思います。 本当に、ありがとうございました。m(__)m
デスクトップの壁紙にしたいのなら・・・ ソースの最後に</BODY>が抜けてますよ？ ホームページの壁紙にしたいのなら、 <!--ここで終了--> のあとに本文を書き、最後に</BODY>でしめればいいですよね。 あと、image/i5.gifはダウンロードしました? これが無いと白い四角の中に赤い×の画像が降って来ますね。 このHTMLを保存するフォルダの中にimageというフォルダを作り、 その中にi5.gifを保存するのですよ。
お礼
アドバイスありがとう御座いました。m(__)m ennoさんが、おっしゃる通り</BODY>を付け加えた所、 ディスクトップ壁紙として表示されました。 しかし、表示されたのは「image/i5.gif」の拡大画像で、 この下記のJava Scriptのソースで作った壁紙画像（上から羽を降らし続ける）そのものを表示させる事は出来ないみたいでした。(^^; 下記の方のアドバイス通り、どうやらJava Scriptで編集さた「動く画像」その物は表示出来ないみたいですネ？(^^; （それとも、僕のやり方が間違ッてるかも？・汗） 僕の質問の説明不足で、どうもすいません。m(__)m
- sinisa
- ベストアンサー率41% (5/12)
どうやら壁紙とは、ホームページ用のことですね。デスクトップのと勘違いしてしまいました。m(_ _)m アニメーションＧＩＦとは、連続したＧＩＦ画像を再生したものです。絵の違ったＧＩＦ画像をいくつか合わせ１つの画像ファイルとして、動いているように見せたものだと思います。（ぱらぱらアニメのようなものかな） ＧＩＦファイルとJava Scriptでかかれたものは、まったく異なる扱いなので、変換はできないと思います。それで、画像ファイルでないと右クリックででる『壁紙に設定』にできないので、Java Scriptについてはできません。 それで、素材屋さんに置いてある動く壁紙はアニメーションＧＩＦであって、Java Scriptとは関係ないものだと思います。下記のJava Scriptでもホームページの壁紙みたいにして使えますよ（ただ、このままだとページに書いた文字の手前に画像が来てしまいますが・・・）。 よく分からないところがありましたら、作りたい壁紙の参考となるサイトのどんなものかを示してくれるとありがたいです。 それでは！！ ＊（下の参考ＵＲＬは僕が使わせていただいているアニメーションＧＩＦ作成のフリーウェアです。）
お礼
sinisaさん、いろいろ詳しくご説明頂き、本当にありがとうございました。m(__)m 素材屋さんに置いてある「動く壁紙」はアニメーションＧＩＦであって、Java Scriptとは関係ないものだったんですネ。(^^; 僕自身、自分のホムペに「ウィンドウの上から羽を降らす」と言うのをやりたくて、自分なりに勉強した所・・・ それをするには、Java Scriptを使うと言う事は解ったのですが、 それはHTML方式でしか表示出来ず（Internet Explorerで表示）、今僕が使っている 「HP作成ソフト（ホームページミックス）」ではGIF形式に変えないと壁紙として使用出来ないみたいなんです。 （このソフトは、タグを打ち込む方法では無く、GIFの画像や文字を貼り付けるだけでHPが作れると言うソフトで、初心者でもHPが作れると言うソフトです。） ですから、僕はてっきり素材屋さんの「動く壁紙」もJava Scriptで作って、GIF形式に変換してるものだと思い、下のソースをGIFに変換して壁紙として使えたら！ッて思ってました。(^^; やっぱり、Java Scriptを使ってHPを作ろうと思えば、 最初からタグなどを使って作るHPソフトでは無いと無理みたいですネ。(^^; いちを、参考にさせて貰った素材屋さんのアドを書せて頂くと http://www.momohouse.net/material.html です。 その所の、上のバーの「アイコン」て言う所をクリックして頂いて、その中の項目の「羽」と言う所を見て参考にさせて頂きました。 また、Java Scriptのソースの参考は http://homepage1.nifty.com/eruna/ です。 そこの左のバーに表示される「Java Script」と言う項目をクリックして頂いて、次に出た画面の左の欄の上から４番目（Backgrounds)を開けて頂いて、その中の「ウィンドウ全体に花を降らすN6X」に書いてあります。 アドバイスありがとございました。(^^) また、この件に関して何か他にアドバイス等が御座いましたら、教えて下さい。m(__)m
- sinisa
- ベストアンサー率41% (5/12)
私はwindows98ですが、「画面のプロパティ」の「背景」タブの壁紙の欄に「ＨＴＭＬドキュメントまたは画像を選択してください。」となっているので、そのままＨＴＭＬファイルを壁紙にできると思います。 もしかしたらＭｅだと違うかもしれませんが、多分変わりないと思いますので、普通に壁紙を変える様にやってみてください。
お礼
ご返答ありがとうござました。m(__)m sinisaさんが、おっしゃる通りにやって 確かに『壁紙に設定』や『名前を付けて背景を保存』と言った項目はあったのですが、 そこがクリック出来ない状態（文字が黒く表示されていない）になって、変換する事ができませんでした。(^^; もしかすると・・・、今 僕が見ている画像の表示は、 下のソースをメモ帳に写し、それを「名前を付けて保存」で、画像名の後ろに「html」を入れ、Internet Explorerで確認表示してるだけだから、１度サーバーにアップロードしなければいけないのですかネ？(^^; すいません。。本当に初心者なもんで。。（汗）
JavaScriptではなくて、 アニメーションGIFの画像なのでは？ それなら、そのまま保存すればいいのですが。
お礼
ご返答ありがとうございます。m(__)m その壁紙がアニメーションGIFかどうなのかは解らないのですが・・下記にかくソースをGIF方式に変える事は不可能なのでしょうか？(^^; <BODY> <!--ここから開始--> <SCRIPT LANGUAGE="JavaScript1.2"> <!-- /*by.lna-town*/ /*http://homepage1.nifty.com/eruna/*/ var no = 15; //ウィンドウに常にイメージの数は15ある。 var speed = 10; var hanaflake = "image/i5.gif";//降らせるgif var ns4up = (document.layers) ? 1 : 0; var ie4up = (document.all) ? 1 : 0; var dx, xp, yp; var am, stx, sty; var i, doc_width = 800, doc_height = 1000; if (ns4up) { doc_width = self.innerWidth; doc_height = self.innerHeight; } else if (ie4up) { doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } dx = new Array(); xp = new Array(); yp = new Array(); am = new Array(); stx = new Array(); sty = new Array(); for (i = 0; i < no; ++ i) { dx[i] = 0; xp[i] = Math.random()*(doc_width-50); yp[i] = Math.random()*doc_height; am[i] = Math.random()*20; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); if (ns4up) { if (i == 0) { document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"lna\"><img src=\"" + hanaflake + "\" border=\"0\"></layer>"); } else { document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"lna\"><img src=\"" + hanaflake + "\" border=\"0\"></layer>"); } } else if (ie4up) { if (i == 0) { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src=\"" + hanaflake + "\" border=\"0\"></div>"); } else { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src=\"" + hanaflake + "\" border=\"0\"></div>"); } } } function hanaNS() { for (i = 0; i < no; ++ i) { yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = self.innerWidth; doc_height = self.innerHeight; } dx[i] += stx[i]; document.layers["dot"+i].top = yp[i]; document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]); } setTimeout("hanaNS()", speed); } function hanaIE() { for (i = 0; i < no; ++ i) { yp[i] += sty[i]; if (yp[i] > doc_height-50) { xp[i] = Math.random()*(doc_width-am[i]-30); yp[i] = 0; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } dx[i] += stx[i]; document.all["dot"+i].style.pixelTop = yp[i]; document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]); } setTimeout("hanaIE()", speed); } if (ns4up) { hanaNS(); } else if (ie4up) { hanaIE(); } --> </script> <!--ここで終了--> です。よろしくお願いいたします。m(__)m
お礼
本当に、ありがとうございます♪(~o~) sinisaさんの言う通りにやってみたら、Internet Expolorer（html形式）で、ちゃんと表示確認出来ました。（大喜） あとは・・・ この完成したホムペを、前のホムペと差し替えたいのですが・・・。 やり方が解らないんです。。（滝汗） （前のホムペは、すでにネット上に掲載されています。） FFFTPを使って、サーバーにアップロードすれば良いのでしょうか？(^^; それと、もう１つお尋ねしたいのですが・・・(^^; sinisaさんのお陰で、『ウィンドウに羽を降らす』をJava Scriptで、乗せる事が出来ましたが・・・ それプラス・・・ 他のJava Scriptソース（文字にカーソルが触れると、文字が拡大する） などのJava Scriptソースを、一緒に書き加えて使う事も可能なのでしょうか？ いくつもの質問、誠に申し訳御座いません。m(__)m