jqueryの実装

http://coliss.com/articles/build-websites/operation/javascript/particles-js.html
これを実装したいと考えているのですが当方にjqueryの知識がなく、できません。

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>デモ</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> </head> <body> <div id="particles-js"></div> <script src="http://vincentgarreau.com/particles.js/particles.js"></script> </body> </html>

以上の記述は間違っていますでしょうか？
また、デスクトップにparticleのフォルダをダウンロードしてそのフォルダの中に以上のHTMLをいれています。これも間違っているのでしょうか？
また、上のサイトにはjsをアップロードして、と書かれているのですがローカル開発の環境を整えて、cyberduckを使わないと制作したものは参照できないのでしょうか？

拙い文章でわかりづらい箇所も多いとは思いますが、回答よろしくお願いいたします。

行動規範の内容に同意します

回答3件

自己解決

最後まで実装できず。。。ご回答者の皆様、ありがとうございました。

投稿2015/10/29 14:03

heihei

総合スコア17

やってみました。
http://vincentgarreau.com/particles.js/particles.jsはjavasriptのファイルがありませんでした。
バージョンが変わって示されたブログのやり方ではうまくいかないようです。

http://vincentgarreau.com/particles.js/
からダウンロードしたzipを解凍するとdemoというフォルダがあるので
そこのindex.htmlを実行するとデモが動きます。

デモをいろいろいじってみるといろんなことがわかると思います。

失礼ですが、ブラウザのデバッグツール（開発ツール？）は利用されてますか？
読み込みがうまくいったかなどの情報はデバックツールのコンソールに表示されます。

投稿2015/10/01 13:51

iwamoto_takaaki

総合スコア2883

紹介ページを見た感じでは、手順がstep1から3までありますが、step3まで対応していますか？
Step3の部分は、サンプルのスクリプトを<script>～</script>に入れるか、JSファイルに保存して読み込むことになると思います。

また、

の部分ですが、このやり方でJSファイルがロードできているのでしょうか？
ダウンロードしたparticleフォルダ内のparticles.jsを指定した方が確実かと思います。

投稿2015/10/01 06:56

yotsu

総合スコア35

heihei

2015/10/01 07:47

ご回答ありがとうございます。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>デモ</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> </head> <body> <div id="particles-js"></div> <script src="/Users/~~~/desktop/particles.js-master/particles.js"></script> <script src="/Users/~~~/desktop/particles.js-master/app.js"></script> </body> </html> 現在このようにしております。~~~は名前の箇所になるので念のため伏せさせていただきました。またstep3はサイトの記述通りapp.jsとして保存し、読み込んでおります。以上で間違っている点はどこの箇所なのでしょうか？お手数おかけしますがよろしくお願いします。

yotsu

2015/10/01 08:33

下記のやり方を試してないのでわかりませんが、パスの書き方が良くなく、ロード出来ていないのではないでしょうか。 <script src="/Users/~~~/desktop/particles.js-master/particles.js"></script> <script src="/Users/~~~/desktop/particles.js-master/app.js"></script> ファイル構成はデスクトップ └particles.js-master ├particles.js ├app.js └このHTMLファイルという構成なのでしょうか？それでしたら、下記の様に変更するとどうでしょうか？ <script src="particles.js"></script> <script src="app.js"></script>

行動規範の内容に同意します

あなたの回答