jQueryがうまく反映されません
- 現在JavaScriptのjQueryの学習をしているのですが、jQueryがうまくページ上で反映されず困っています。
- googleからjQueryファイルを読み取って利用しようとしていますが、ブラウザはGoogle Chromeを使用しています。
- コードの中でカラーとフォントを指定しているのですが、反映されていません。解決方法に心当たりのある方、ご教授願います。
- ベストアンサー
ｊQueryが使用できません
現在JavasscriptのｊQueryの学習をしているのですが、ｊQueryがうまくページ上で反映されず、さっそく困っています。 下記コードのようにカラー、フォントを指定しているのですが、反映されません。 方法としてはgoogleからｊQueryファイルを読み取って利用しようとしています。 ブラウザはgooglechoromeを使用しています。 <doctype! html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>jQuery</title> <script src="http://code.jquery.com/jquery-1.10.1.min.js"> $(function(){ $("h1").css("background-color", "yellow"); $("strong, em").css({ "font-size": "150%", "font-style": "italic", "color": "blue" }); }); </script> </head> <body> <h1>jQuery</h1> <p><strong>jQury</strong>は便利なJavascriptの<em>ライブラリ</em></p> </body> </html> 解決方法に心当たりのある方、どうかよろしくお願いします。
- 11309646Ks
- お礼率29% (5/17)
- その他（インターネット・Webサービス）
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
<script src="http://code.jquery.com/jquery-1.10.1.min.js"> $(function(){ ・・・・・・ となっているのを <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <script> $(function(){ ・・・・・・ に直しましょう。 <script>タグでsrcを指定して外部ファイルを読み込んだ場合、それで一つの処理として扱われるので一旦<script>タグを閉じます。 そして、新たに<script>タグを開いてプログラムを書きます。
関連するQ&A
- jQueryについて教えてください
現在ドットインストールでjQueryを勉強しています いきなりつまずいたといいますかエラー？があります 以下のコードなのですが文字色（<p>）が赤色になりません なぜでしょうか？ このコードではjQueryはDLせずに読み込ませています DLしたほうがいいでしょうか？ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <head> <body> <p>jQueryの練習</p> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script> $(function () { $('p').css('color', 'red'); }); </script> </body> </html>
- ベストアンサー
- JavaScript
- 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 読み込み
jQuery 読み込み ソースなのですが <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>jqueryの練習</title> </head> <body> <p>jQueryの練習</p> <script src="http://code.jquery.com/jquery-1.10.1min.js"></script> <script> $(function(){ $('p').css('color','red').hide('slow'); }); </script> </body> </html> で9行目と11行目がエラーになります。 英語読めないのでエラーの内容はわかりませんが jQueryが読み込めてないのだと思っていて そこで質問なのですが 9行目で「http:～」と絶対パスで指定してるのにも関わらず jQueryを読み込めない理由って何かありますでしょうか？ （全く的外れな事を言い出していたらごめんなさい。）
- ベストアンサー
- JavaScript
- jQueryのdraggable縦書き出来ますか？
プログラム自体初めてなのですが、仕事の関係で作らないといけない事になりました。 目的は、「文字が書かれた札をドラッグで色々と動かして操作したいです。」 jQueryのdraggableを使用して札のようなものをマウスのドラッグで色々と動かしたいと考え 作ってみましたが、札の中がどうしても横書きになってしまいます。 「札の中を縦書きにする方法を教えて頂けないでしょうか？」 基本的な考え方が間違っているかもしれませんが出来るのであればどうか教えてほしいです。 とりあえずここまでは書いています。 質問が分かりづらく申し訳ありません。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>jQuery UI Draggable - Default functionality</title> <link rel="stylesheet"href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery- 1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css" /> <style> #draggable01 { width: 25px; height: 500px; padding: 0.5em; } #draggable02 { width: 25px; height: 350px; padding: 0.5em; } </style> <script> $(function() { $( "#draggable01" ).draggable(); }); </script> <script> $(function() { $( "#draggable02" ).draggable(); }); </script> </head> <body> <div> <div id="draggable01" class="ui-widget-content"> <p>あいうえお</p></div> <div id="draggable02" class="ui-widget-content"> <p>かきくけこ</p></div> </div> </body></html>
- ベストアンサー
- JavaScript
- DreamWeaverでJS
Webデザイン初心者です。 jQuery初チャレンジということで、DWにてJSファイルを作って、JSのコードを入力したところ結果がHTMLの画面に反映されませんでした汗 "jQuery練習"を赤文字にするだけというロジックのかけらもほとんどないようなコードなんですが、sublimeでは結果は出ました。ですがDWでは駄目でした。 『HTMLのファイル』 <!DOCTYPE html> <html lang= "ja"> <head> <meta charset="utf-8"> <title>jQueryの練習</title> <script type="javascript" src="JS練習.js"></script> </head> <body> <p>jQueryの練習</p> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> </body> </html> 『JSファイル』 $(function(){ $('p').css('color' , 'red'); }); 何が足りないのでしょうか。ググってもピンポイントででませんでした。すみませんがわざわざお時間を割いていただけるかた、お助けお願いいたします。 どなたか教えてください。よろしくお願いいたします。
- ベストアンサー
- JavaScript
- jquery uiが動かない
jquery uiが動きません。 何度も見直し、プログラムを書いてもどこがいけないかわかりません。 教えていただけたら幸いです。お願いいたします <html> <head> <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script> <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> </head> <body> <div id="box">box</div> <style> #box{ width:100px; height:100px; background:red; } </style> <script> $(function(){ $("#box").draggable( axis: 'x'; ); }); </script> </body> </html>
- ベストアンサー
- JavaScript
- HTMLが正しく実行されない。
やさしいｗｅｂプログラミングに掲載されている文で、教科書通りにかいても正しく表示されません。 どこがいけないのでしょうか？ <!DOCTYPE html> <html lang="ja"> <head> <link rel="stylesheet" href="Sample.css"> <title>サンプル</title> </head> <body> <h1>現在の時刻</h1> <p> <script type="text/javascript"> var d = new Date(); document.writeln(d); </script> </p> <h1>現在の時刻</h1> <p> <script type="text/javascript"> var d = new Date(); document.writeln(d); </script> </p> </body> </html> Sample.cssも書きます。body{ background-color: #FFFFF0; } h1{ background-color: #99CC33; } h2{ background-color: #A3AA60; } p{ font-size: 2em; font-family: fantasy; }
- 締切済み
- HTML
- （jQuery)どこがエラーなのか分からない
●質問の主旨 下記のコードはどこが間違いでしょうか？ Javascriptコンソールでも特にエラー表示がされません。 ご存知のかたご教示願います ●コードの意図 1．ボタン要素（button）をクリック 2．非表示(none)にされていたdiv要素（赤い正方形）が出現する ●コード （click.html) <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>JavaScriptの勉強</title> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> </head> <body> <h1>JavaScriptの勉強</h1> <script> $(function() { $("button").click(function() { $("target").show('slow'); }); }); </script> <p><button id='button'>クリック</button></p> <div id="target" style="display"; none; width: 150px; height:150px; background-color: red;></div> </body> </html>
- ベストアンサー
- JavaScript
- h1のみが反映されない！？
外部.cssに body { font-size : 80%; font-family:Verdana,Chicago,osaka,sans-serif,"ＭＳ Ｐゴシック"; line-height: 140%; text-align: center; background-color : #ffffff; color:#555; } /* タイトル*/ h1 { font-size:2.3em; color:#ffffff; text-align:left; padding: 10px 0px 0px 10px; } h2 { font-size:1.2em; color:#ff0000; text-align:left; padding: 10px 0px 0px 10px; } h3 { font-size:1.2em; color:#ff0000; text-align:rihgt; padding: 10px 10px 0px 0px; } と設定し、HTML内で任意の＊＊＊場所に <div id="＊＊＊"> <h1>タイトル</h1> </div> と記述してもデフォルトサイズと#555のカラーになってしまいます。 text-align:left; や padding: 10px 0px 0px 10px; も全く反映しません。 タイトルの位置を任意の場所を変更しても、状況は同じで <h1>を<h2>や<h3>に打ち直すと.css通りきちんと反映されます。 全体.css記述をコピーすると膨大なので省略しますが、解せないのは<h2>や<h3>なら反映するのに、<h1>のみ反映しないのがわかりません。 色々試してみましたが、今現在は<h1>で表示したいタイトルを h2 { font-size:2.3em; color:#ffffff; text-align:left; padding: 10px 0px 0px 10px; } としてＵＰしてますが、<h1>と記述してWEB上で反映しない原因は何でしょうか？宜しくお願い致します。
- ベストアンサー
- HTML
- jQueryで<body>内の特定のコードを削除
よろしくお願いします。 jQuery（ver.1.8.3）を使って<body>内に記述されているHTMLコードを削除したいのですが、どのように書いたらいいのでしょうか。 ■削除したいコード <script src="http://www.hoge.com/hoge.js"></script> ■HTML <html> <head>省略</head> <body> <script src="jquery-1.8.3.min.js"></script> <script> $(function(){ 削除するスクリプト？ }); </script> <script src="http://www.hoge.com/hoge.js"></script> </body> <html> こちらからは編集できない領域にあるHTMLコードのため、jQueryを使ってどうにか削除できないかと思い質問させて頂きました。 どうぞよろしくお願い致します。
- 締切済み
- JavaScript
お礼
明快な解答をありがとうございました。 解決した上に、勉強にもなりました。 よかったらまたよろしくお願いします！