• ベストアンサー
  • すぐに回答を!

jQuery を書くファイルはどれですか

ほんっとうに基本的なことすぎて見つけられないのかもしれないのですが、 2日間ググってもわからないのでお助けください。 jQuery でアコーディオンメニューを作りたいと思っています。 だいたいのサイトをみると、サイトより jQueryをダウンロードしろと 書かれているのでuncompressedのものをダウンロードして、jQuery.jsと リネームしたのちに jsフォルダ内に格納しました。 あとは、html、CSS、jQuery の3つの記述が掲載されているのですが、 jQuery をどこに書くのかわかりません。 どういう名前のどの拡張子(js?)でhtmlファイルに読み込ませるのか、 それともhtmlファイルに書くのかすらわかりません。 なにとぞご教示お願いいたします。

共感・応援の気持ちを伝えよう!

  • 回答数3
  • 閲覧数1820
  • ありがとう数7

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

  • ベストアンサー
  • 回答No.2
  • t_ohta
  • ベストアンサー率38% (3542/9250)

jQueryを書くという意味がよくわかりませんが、jQueryを使えるようにするにはHTMLファイルの<head>~</head>の間に <script src="js/jQuery.js"></script> と書けばjQueryの機能が利用できるようになります。 jQueryを使ったJavaScriptのプログラムは、HTMLファイルの適当なところに <script>~</script> を用意して、scriptタグに囲まれた中に記述すれば動きます。 複数のページで同じプログラムを使うなら適当な名前のファイル(hoge.js とか)を用意して、その中にプログラムを書き、先のjQueryの読み込み同様<head>~</head>の間に <script src="js/hoge.js"></script> と書けば動きます。

共感・感謝の気持ちを伝えよう!

質問者からのお礼

質問の意味がわかりづらくて申し訳ありません。 どういうふうに説明していいかわからないほど、わかっていませんでした。 <script>~</script>にアコーディオンのjQueryを書けばできました。 html、css、jQuery.js、jQueryでやりたいことのうち、 jQuery でやりたいことをどこに書いてよいかわからなかったのです。 ありがとうございました。

関連するQ&A

  • jQueryPlugin「fancybox」のパス

     初歩的な質問ですみません。。 jQueryPlugin「fancybox」を使いたいと思い、下記のサイトから ダウンロードしました。 http://fancybox.net/ ダウンロードされた、「jquery.fancybox-1.3.4」のフォルダを 開いたところ、ファイルがいっしょくただったので、 imgフォルダと、jsフォルダとcssフォルダを作り、ファイルを 整理しようと思いました。 「example」を「img」にリネームして、 「fancybox」のpngとgifデータを「img」フォルダに移しました。 「fancybox」は「js」にリネームして、jsファイルをそのまま格納。 「fancybox」の「jquery.fancybox-1.3.4.css」は「css」フォルダ を作って移しました。 「css」フォルダに移した「jquery.fancybox-1.3.4.css」の画像の パスを、 > #fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url('fancybox.png'); } > > #fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url('./img/fancybox.png'); } > 上のようにとしましたが、 「fancybox.png」を初めとする、画像のパーツが反映されません。 パスが間違っているのでしょうか。。 ファイルを移動させた時に混乱してしまうのですが、図などを書いて おけば分かりやすいでしょうか。 アドバイスをいただけましたら幸いです。

  • なぜjQuery UIを使う時こんなにjsファイルを使うの?

    どうもはじめまして。 早速ですがjQueryについて質問です。 jQuery UIのアコーディオンにしてもtabsにしても、使う時4つも5つもjsファイルを取り込みますよね?これってなぜなんでしょうか? 単純にコピー&ペーストで一つにまとめることってできないのでしょうか? 知っている方いましたらよろしくお願いします。

  • jQuery

    http://blog.daichifive.com/archives/602 このページにあるようなスクロールをさせたいのですが、 jquery.scroller.d5.jsはページ内でダウンロードできますが、 jquery.jsはどこからダウンロードすればよいのですか? jQueryeasysliderのjqueryjsをつかってみたのですが、 上記サイトではjsファイルの最下部でスクロールさせたいものだけをカスタマイズできるとあるので、 easysliderのjqueryjsは使えないような気がします。 初歩的な質問ですみません。 あまり詳しくないです。 宜しくお願いします。

    • ベストアンサー
    • CSS

その他の回答 (2)

  • 回答No.3

大変失礼かと思いますが・・・回答させて下さい。 「2日間ググってもわからない・・・」と有りますが? jQueryで検索すれば色々なサイトが見つかります。 そこにはサンプルのhtmlやJavaScript(当然jQueryも含んだ物)が有ります。 それもステップを追って解説してあるサイトも見つかります。 当然、アコーディオンメニューもサンプルで出てきます。 短絡的な回答/サンプルのみ求めて何も試していないのでは有りませんか? 2日間も有れば簡単なアコーディオンメニューも作成できると思います。 それらをやって見れば「どこに書くのかわかりません」などと言う質問は出てきません。 短絡的にコピペで出来るものを求めているのなら「[技術者向] コンピューター」で質問する以前の問題です。 すでに回答を頂いている2名の方にも失礼に成ります。 基本的に(麦僊とした概念を質問する場合を除いて)   ・・・の環境で使っています   ・・・を参考に   自分は・・・で・・・すれば出来ると思い   ・・・したけど   ・・・出来ませんでした   ・・・のエラーが出ます(または誤動作します)   ・・・の様な使い方は(考えは) ・・・などの自身の試行錯誤が垣間見えるのは、とても微笑ましく皆さん回答すると思います。 極端な言い方をすれば   「ホームページを書きたいのですがホームページは何処に有りますか?」 と、似たような質問だと思います。2日間、何をしていたのですか? 御免なさい、大変お気に触ることばかり書いてしまいました。 今日はチョイト機嫌が悪いのかも知れません?!?! 最後に、 コンピュータの世界は簡単なコピペでは何も作れません。 一時的にコピペで出来ても、そこから消化/吸収して本物を作ってください。

共感・感謝の気持ちを伝えよう!

質問者からのお礼

まず、回答になっていませんし、謝るくらいなら書かないでください。 先のお二人は、意味不明な質問内容にも関わらず想像でも回答をしてくださいました。 わたしの質問の仕方がなってなかったと反省はしています。 アコーディオンのサンプルページでは、html、css、jQueryの3つのプログラムに分かれており、 jQueryと書かれた部分がどこにはいるのかわからなかったのです。 どのサイトを参考にしているか記載すれば、よい質問ができたかもしれません。

  • 回答No.1
noname#174753

fire fox で書き込めます

共感・感謝の気持ちを伝えよう!

質問者からのお礼

回答ありがとうございます。 fire fox でも書き込むことができるのですね。 もう少し詳しくなってから試してみます。

関連するQ&A

  • jqueryが動作しない

    jqueryが動作しません。 私が行った手順を書きます。jqueryのサイトからdownloadをします。英文だったのでDreamweaverで開いて名前を付けて別名で保存しました。jquery-1.8.0.js拡張子で保存。 ソースコードをかいてみました。 <html> <head> <script src="jquery-1.8.1.min.js"></script> // urlを指定した場合です。 <script src="http]//jquery-1.8.1.min .js"></script> </head> <body> <h1>Jquery</h1> <script> $(function(){ $('h1').css('color'.'red'); }); </script> </body> </html> これを保存します。(拡張子は.navi.html) 実行しても動作しません。どうしてでしょうか?

  • たすけて!jQueryがさっぱりわかりません!

    Dreamweaverでサイトを制作しています。 jQueryは何をどこにダウンロードして何をどこにうちこめばいいのか? さっぱりわかりません…。 http://jquery.com/からなにかをダウンロードするということはわかるのですが…。いろいろありすぎて何をダウンロードすればいいのか…。 しかもダウンロードしたファイルはどこに保存してどうやってhtmlとむすびつけるのか。 タグはhtmlのどこに書けばいいのか、くわしく赤ちゃんに説明するつもりで教えていただけると助かります。 ちなみに(http://toddmotto.com/introducing-superbox-the-reimagined-lightbox-gallery/)を使いたいのです。 サイトを見たのですがこのコードはどこにいれたらいいのかさっぱりわかりません。 head内なのかbodyなのかはたまた別でcssを作るのか? 【質問まとめ】 ・(http://toddmotto.com/introducing-superbox-the-reimagined-lightbox-gallery/)のギャラリーをつかいたいが取り込み方がわからない。 ・上記URLからのダウンロード以外で(http://jquery.com/)からのダウンロードは必要なのか? ・ダウンロードしたものはファイルのどこにいれたらいいのか。 ・どうすれば現在つくっているhtmlにjsをむすびつけられるのか? ・head、bodyそれぞれになにをいれたらいいのか? ・ともかくなにをどこにいれたらいいのかさっぱりわかりません。 ・こういうものは$(function(){})どこにいれたらいいのか、これはなんなのか? 質問が多くてすみません。どうかよろしくお願いします。

  • jquery3系がうまくいかない

    jquery3系が出ていたので使ってみたのですが、CDNはうまくいったのですが、そのものをダウンロードして使うほうがうまくいきません。 https://code.jquery.com/jquery-3.1.1.min.js のソースコードをコピペしてjquery-3.1.1.min.jsというファイルを自分で作って下記のようにしているのですが、CDNが読み込まれなかった場合に読み込むというやり方のようです。 <!-- start load jquery --> <!--[if lt IE 9]> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="/js/jquery-1.11.0.min.js"><\/script>')</script> <![endif]--> <!--[if gte IE 9]><!--> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="/js/jquery-3.1.1.min.js"><\/script>')</script> <!--<![endif]--> <!-- end load jquery --> ・もちろん下記のようにもしましたが駄目でした。 <!-- start load jquery --> <!--[if lt IE 9]> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="/js/jquery-1.11.0.min.js"><\/script>')</script> <![endif]--> <!--[if gte IE 9]><!--> <script>window.jQuery || document.write('<script src="/js/jquery-3.1.1.min.js"><\/script>')</script> <!--<![endif]--> <!-- end load jquery -->

  • jQueryの基本的なことについて教えてください

    自サイトで 「jQuery Slider&#178;」http://wex.im/javascript/jquery-slider2 を設置しようと試みています。 私はhtmlとcssの知識しかありません。 今までずっと、HTML 4.01 Transitionalで、タグ打ちしながらサイトの作成をしていました。 行き詰ったらその都度ネットで調べて…という感じで 10年以上サイト製作をしていますが素人ほどの知識だと思っています。 それで、初めて上のスライドショーを設置しようと色んなサイトを参考にしたのですがうまく動きません。 (google chrome、IE8で見ています) 何が悪いのか…と上記URLの配布サイトを見たところ、 Examples <head> stuff <script type="text/javascript" src="js/jquery.slider.min.js"></script> <link href="css/jquery.slider.css" rel="stylesheet" type="text/css" /> と、2段目がtype="text/css" />という風に閉じてあって、 あぁ、これってページ全体をもうhtmlじゃなくて xhtmlで書かないと動かないって事なのかなぁ、という疑問が沸いてきました。 実際このスライドショーに限らず、jqueryのプラグインを使用している 色んなサイトがxhtml方式になっているのを確認しましたが jQueryのプラグインは、xhtmlでないと動かないものでしょうか? それとも、このプラグインに限ってはxhtmlなのでしょうか? よろしくお願いいたします。

  • jqueryティッカーについて

    http://www.ar-ch.org/mt/archives/2010/07/jquery.html 上のサイトで紹介しているスライドで動くスティッカーを実装しようと思ったのですが、サイトで紹介しているリンク先にはjquery.bxslider2.0.1.min.jsのファイルがありません。 ダウンロードはしたもののファイルが違うせいか紹介している通りになりませんでした。 説明不足かもしれませんが、自身jqueryは入門段階なので教えて頂けるのであれば簡単に説明していただけるとありがたいです。

  • Jqueryのjavascriptが読み込まれません

    はじめまして。 Jqueryのsuperfishを使用したサイトを作っているのですが、javascriptファイルが読み込まれていないような状態になっています。 具体的には 1)ローカル環境では問題なく読み込まれている 2)サーバにアップすると、同階層の別ページ(A.htmlとします)では機能しているのに、特定のページ(B.html)では読み込まれていない ※A.htmlとB.htmlで同じ効果(superfishによるアコーディオンナビ実装)を得たい 3)A.htmlの<head>内javascriptに関する記述とB.html内同箇所の記述は全く同じ 4)B.html内の他の単独のjavascriptは問題なく読み込まれる という状況です。 この場合どのような原因が考えられるのでしょうか。 javascriptについては全くの初心者であり、どうにも解決できず、困っています。 ちなみに使用しているjqueryはjquery-1.2.6.min.jsです。 (大元であるA.htmlは違う方にコーディングしてもらい、そのデータを元にB.htmlをコーディングする作業をしています) jquery-1.2.6.min.jsもしくはsuperfish.js内に動かすhtmlへのパスが記載されているのかとも思いましたが、知識不足で該当の箇所が見つけられず…。 ご意見を頂ければ幸いです。 どうぞよろしくお願い致します。

  • jqueryのプラグインdroppy.jsについて

    WEBデザイン初心者です。 グローバルナビ部分を、ドロップダウンリストにしたいなと思い、jqueryで実装しようと思っています。 調べてみたところ、よく使われているプラグインにdroppy.jsというものがありましたが、 どの紹介サイトでもjQueryのサイトにリンクされています。 ただ、そこから、ダウンロードファイルが見つかりません。 もしかして、jQueryサイトでは取り扱わなくなったプラグインなのでしょうか。 あまりにもdroppyの事例が多いので、できれば導入したいのですが、分かる方いれば、よろしくお願いします。

  • jquery lightboxを設定しようとしていますが問題がでてます

    jquery lightboxを設定しようとしていますが問題がでてます.... functionの部分を htmlに直接表記すれば動く状態ですが、 functionの部分を外部に登録するとなぜか動かなくなってしまいます。 jquery.lightbox-0.5.min.jsというファイルにファンクションを書き足せばいいとの ことですが.. なにか 以下のHTMLソースに足らない部分がありますか? ご教授ねがいます。 <link href="css/top.css" rel="stylesheet" type="text/css"> <link href="css/print.css" rel="stylesheet" type="text/css" media="print"> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <script type="text/javascript"> $(function() { $('.up_image a').lightBox({ overlayBgColor: '#FFF', overlayOpacity: 0.7, txtImage: '画像', txtOf: 'の' } ); }); </script> </head>

  • 外部ファイルを読み込んだhtmlをinclude

    外部ファイルを読み込んだhtmlをincludeしたいです。 ディレクトリの階層は、 index.php style.css /pic/picture.html /pic/css/style1.css /pic/css/style2.css : /pic/css/style13.css /pic/js/jquery1.js /pic/js/jquery2.js : /pic/js/jquery15.js : (画像などが他にもいっぱい) となっています。 ----- picture.html内には <link rel="stylesheet" type="text/css" href="css/style1.css"> <link rel="stylesheet" type="text/css" href="css/style2.css"> : <link rel="stylesheet" type="text/css" href="css/style13.css"> <link rel="stylesheet" type="text/css" href="js/jquery1.js"> <link rel="stylesheet" type="text/css" href="js/jquery2.js"> : <link rel="stylesheet" type="text/css" href="js/jquery15.js"> : と書かれています。 ---- このときindex.phpのbody内に <?php include('./picture.html'); ?> とした場合、相対パスによる記述なのでpicture.html以外のcssやjsは適用されませんよね。 しかし/pic/内にあるすべてのpicture.htmlに関係するファイルは非常に数が多いので、これらすべてをincludeするのは厳しいです。 すべての外部ファイルを読み込んだ状態のpicture.htmlをbody内に表示したいのですが、そんなことは可能でしょうか。 どなたかご教示ください。どうかよろしくお願いします。

    • ベストアンサー
    • PHP
  • jQueryについて教えてください

    jQueryというJSがあるのは誰もがご存知だと思います。 私も名前や少しだけ使ったことがありますが、いまいち漠然として分かりません。 初歩的な質問で申し訳ないのですが、 極論から言うとjQueryでいったいどの位の表現?機能を使うことができるのですか? 本も買ってみたり、ネットでも調べると何かしらjQueryを使ったプログラムはありますが、それが全てではないと思いますし、むしろ極一部だと思います。 jQueryを使うと、どんな事を、どうやったら、何ができる? って事がどうして皆さん分かるのでしょうか? 例えば何かイメージしてる動きがあって、それはネットで調べれば近い情報は出てくると思います。 しかし、jQueryである必要も無ければ、jQueryの方が楽な場合もあると思います。 だけどjQueryだとなぜ楽に作れるのか、それが理解できなくて困っています。 JavaScriptの知識はかじる程度しかないですが、 jQueryを理解するにはjQueryのソースを理解しないと、何ができるかは判断できないのでしょうか? また、「jQueryでできることの一覧」みたいなサイトってありますか? あと、jQueryで使えるライブラリの意味がいまいち分かりませんが、 これはjQueryを理解してる人が、使いやすいように作った別のJSファイルって認識で良いのでしょうか? どうも根本的な事を理解しきれてなくて、教えていただきたく。