jQuery(179)

178follower
harada さんのアバター 5,143views

jQueryで画面サイズによって処理内容を変える

レスポンシブなサイトを作っているときなどに役に立ちそうですね。 $(window).resize(function(){ var w = $(window).width(); var x = 568; if (w ... 2014年4月30日
harada さんのアバター 385views

jQueryでリストの順番を自動で変更する

jQueryでリストの順番を自動で変更する方法です。 表示サンプルはこちら。 jQueryはあらかじめ読み込みます。 <script type="text/javascript" src="//aj... 2014年4月18日
harada さんのアバター 4,085views

jQueryでスクロール後の固定ヘッダーのスタイルを変更する

ページを表示したときと、スクロールを開始した場合で表示スタイルを変更する方法です。トップのビジュアルの印象をより強めたいときなどに役立ちます。表示サンプル Javascript 今回はBootstrapのクラスを利用して表示しているので... 2014年4月14日
goto_jp さんのアバター 2,591views

jQuery利用例:HTMLを書き換える

サンプルはこちら。http://jsdo.it/goto_jp/kq97 対象のオブジェクト内のHTMLを丸々書き換えます。 JavaScript $(function(){ //html()が空なら中身のHTMLを返す ... 2014年4月14日
goto_jp さんのアバター 2,135views

jQuery利用例:位置座標の取得・制御

サンプルはこちら。http://jsdo.it/goto_jp/iCII 普通のWebサイト制作ではあまりサンプルのように動かす機会は少ないですが、画面上のポップアップ表示やモーダルウィンドウの類を操作する時には位置座標を操作することもあ... 2014年4月11日
goto_jp さんのアバター 653views

jQuery利用例:幅と高さの取得・制御

サンプルはこちら。http://jsdo.it/goto_jp/vUtb jQueryで幅と高さの取得と制御は実に分かりやすく簡単です。 JavaScript $(".box").width(); $("... 2014年4月11日
goto_jp さんのアバター 471views

jQuery利用例:CSSの取得と操作

サンプルはこちらhttp://jsdo.it/goto_jp/acoR 今回は内部的なデータの取り扱いの話になりますが、JavaScriptを使うことでCSSを切り替える方法はいくつかあります。そのための例を上記サンプルに掲載していますが... 2014年4月10日
goto_jp さんのアバター 288views

jQuery利用例:値操作のサンプル

表示サンプルはこちらhttp://jsdo.it/goto_jp/oovM 値の表示・取得はJavaScriptを使ったUI操作の基礎中の基礎です。CSSができる人ならばstyle属性やクラス名操作が出来てしまえば、表示はどのようにでも操... 2014年4月10日
goto_jp さんのアバター 356views

jQuery利用例:偶数行の自動判別

サンプルはこちら。http://jsdo.it/goto_jp/9yGi jQuery(及びJavaScript)を使うのは特殊な動作をするためのものと思われがちですが、UI表現の効率化に利用することもできます。 HTML <t... 2014年4月9日
goto_jp さんのアバター 9,349views

jQuery:toggleとtoggleClassを正しく使いこなす

toggle()指定した要素に直接スタイルの「display:none」を付与・解除を行う。 toggleClass()指定した要素に指定したクラスの付与・解除を行う。 toggleは表示のオン・オフのみでシンプルに扱えますが、何かをス... 2014年4月9日
goto_jp さんのアバター 2,005views

jQueryのeach文で特定条件ループを作る

each文の詳細についてはこちら。http://semooh.jp/jquery/api/core/each/callback/ HTML <ul> <li><a href="#"&... 2014年4月8日
goto_jp さんのアバター 57,008views

jQueryでアコーディオンメニューを作る

See the Pen jquery accordion menu by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 以前CSSだけで動くものを紹介しましたが、古いブラウザ対応ならjQuer... 2014年4月8日
Yukimi Sato さんのアバター 348views

JSでブラウザの種類によって付与されるクラスを変える

IE6の時は「.ie6」、IE6以上の時は「.ie7」、FireFoxの場合は「.firefox」、Chromeの場合は「.chrome」が「.browser」に付与されます。 <script type="text/jav... 2014年4月4日
otaguro さんのアバター 288views

jQueryで任意の位置に子ノードを追加する方法

子要素の末尾に新しい要素を追加する場合は、次のようにappendToを使いますが、 ParentNode.appendTo(newNode); 子要素の2番目など、任意の位置に新しい要素を追加したい場合は、次のようにします。 Pare... 2014年3月24日
harada さんのアバター 998views

jQueryで指定の要素の親要素から特定のクラスを削除する

指定した要素の親要素から、class=”error”を削除するという記述です。 jQuery(this).parent().removeClass('error'); ... 2014年3月20日
harada さんのアバター 530views

jQueryで指定の要素を囲む&外す

jQueryで指定の要素を囲む jQuery(id).wrapAll('<div class="control-group error">'); jQueryで指定の要素の親要素を外す... 2014年3月17日
harada さんのアバター 415views

IEでもplaceholder属性をvalue値に変換して表示

<input type="text" placeholder="テキストを入力してください" size="30" id="s"> <scrip... 2014年3月10日
harada さんのアバター 528views

fb.wallで取得するFacebookページのウォール投稿に空白のアクティビティが出てしまうときの対処方法

fb.wallでFacebookページのウォール投稿を取得する際に、無駄なアクティビティ(返信コメント)を拾ってしまうことがありました。しかも取得するのは日付のみで、本文は取得してくれないため空白の投稿となってしまいます。 そこで、jqu... 2013年12月11日
harada さんのアバター 825views

fb.wallで表示するFacebookページのウォール投稿日時をカスタマイズ

Facebook純正のLike Boxを使うのがいちばん利便性がいいことは間違いないのですが、Like BoxはほぼIframeで制御されているため自由がききません。そこでfb.wallというjQueryプラグインを利用することでサイトに自... 2013年12月6日