jQueryにおけるattrとpropの違いと使いドコロまとめ - Qiita
checkboxやradioのチェック状態を調べる際にはattrではなくpropを使うのが良い。 attrでも取れないこともないですが、propで取得する方が処理が早いです。 特にIEの場合、inputに対するdisabledの処理がものすごく重く、attrでdisabledやcheckedの処理を沢山していると、無駄に最悪な感じで負荷がかかります。 attrとpropの取得の違い## またこの２つは、同じ値を取得してるようで異なる値を取得するので注意。 例えば の場合、 チェック時 prop true attr checked 非チェック時 prop false attr undefined という全然違う値が返ってきます。 なぜ解釈が違うのか## attrは純粋に 属性における値 を取得するので、この場合は、 checkされてない ↓ checkedという『属性』がない！ ↓ unde
[JS]エフェクトの美しさがスゴイ！Webページを水面にし、波紋を生み出すスクリプト -jQuery Ripple
Googleの新UX「Material Design」のアナウンス以降、波紋のエフェクトを数多く紹介してきました。例えばこれとかRiiple Click EffectとかWavesとか。 それらとは一味違い、WebGLでリアルな波紋を描くjQueryのプラグインを紹介します。 jQuery Ripples Plugin -GitHub ↑ファイルサイズを軽減してます。実際はもっと本物の水面です。 jQuery Rippleのデモ jQuery Rippleの使い方 jQuery Rippleのデモ デモはChrome, Safari, Firefox, Opera, IEは11+で、OpenGL 2.0対応のビデオカード内蔵のPCでご覧ください。 ページ上をクリックすると、そこから波紋がどんどん増えます。 jQuery Rippleの使い方 Step 1: 外部ファイル 当スクリプトとjq
![[JS]エフェクトの美しさがスゴイ！Webページを水面にし、波紋を生み出すスクリプト -jQuery Ripple](https://cdn-ak-scissors.b.st-hatena.com/image/square/c4d2ad555b67ee7509f227b6ac09d4c92e1ab29b/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201404%2F2014110501.gif)
「jQuery 2.x→jQuery 3.0」「jQuery 1.x→jQuery Compat 3.0」に。jQueryが新名称と新バージョンへ
「jQuery 2.x→jQuery 3.0」「jQuery 1.x→jQuery Compat 3.0」に。jQueryが新名称と新バージョンへ JavaScriptのライブラリとして人気のあるjQueryは現在、モダンブラウザのみサポートすることで、より小さく速く安定したjQuery 2.x系と、古いバージョンのWebブラウザを含む幅広いWebブラウザをサポートするjQuery 1.x系の2つが存在しています。 この2つのバージョン表記を、次のリリースから変更することが、jQueryのブログにポストされた記事「jQuery 3.0: The Next Generations」で発表されました。 バージョンは3.0に統一 現在のjQuery 1.9系とjQuery 2.0系は、前述のようにサポートするブラウザが異なるだけで、APIは基本的に互換性があります。 そこで、次のリリースからこの
webhako.net
webhako.net このドメインを購入する。 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
unbind([type], [data]) - jQuery 日本語リファレンス
bind関数とは反対に、各要素のイベントに関連付けられた関数を削除します。 引数を全て省略した場合、全ての要素から全イベントが削除されます。 第一引数にイベント名が指定された場合、そのイベントに関連付けられた関数だけが削除されます。 第二引数に関数ポインタを渡した場合、指定イベントに結び付けられた、指定の関数のみが削除されます。 bindしたカスタムイベントを削除することも可能です。 “theone”というボタンは、最初はクリックしても何も起こりません。 “bind”をクリックすると、”theone”のクリックにaClick関数をひもづけて、クリックされたことが表示されるようにします。 “unbind”をクリックすると、このaClick関数がunbindされ、クリックしても何も起きない状態に戻ります。 <button id="theone">Does nothing...</button>
jQuery . param( obj, traditional ) - jQuery API 日本語リファレンス
var object = { string: 'value', array: [ 'item1', 'item2', 'item3' ], map: { key1: 'value1', key2: 'value2' } } var result = jQuery . param( object ); 変数objectの内容を、シリアライズし、変数resultに格納。 実装例（サンプル） jQuery . param( object ) decodeURIComponent( jQuery . param( object ) ) jQuery . param( object, true ) decodeURIComponent( jQuery . param( object ), true ) 実装例（サンプル）について をシリアライズした結果を、黄色のボックス要素内に表示したもの。 jQu
jQueryを使った、連想配列の連結 - it's an endless world.
これでいけるっぽい。 var hoge = { "property1":"value1", "property2":"value2" }; var fuga = { "property3":"value3" }; var arr = $.extend(hoge,fuga);
jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com
必要ならどうぞ。 デモ jQueryでフォームの値を取得する方法をまとめ – jsdo.it – Share JavaScript, HTML5 and CSS jQueryでフォームの値を取得する方法をまとめ – jsdo.it – share JavaScript, HTML5 and CSS 共通：要素の探し方 input要素なんかにid振っちゃうのが一番なんだけど、属性セレクターを使うと楽な場合があります。つまり[name=xxx]で検索するやり方。 <form id="my-form"> <input type="text" name="my-text" value="This is text." /> </form>
jQueryのserializeはform要素以外にも使えるの知ってましたか？ · DQNEO日記
jQueryにはserialize()という便利メソッドがあって、formの入力値をまるごとクエリ文字列に変換することができます。 クエリ文字列というのはこういうやつです。 ?username=hoge&email=fuga さてこのserialize()の使い方ですが、ぐぐるとform要素に適用するサンプルコードばかり出てきます。 $('form').serialize(); しかし実はこれ、form要素に対してだけではなく任意のDOM要素に対して適用できるんです。 つまりform丸ごとではなく、いつくかのinput要素だけピックアップしてserialize()することができるのです。 serialize()の使い方 HTML <input type="text" name="email" > <input type="text" name="username" > このようなinput
jQueryのプラグインを探す時に便利なサイトのまとめ
星の数ほどあるたくさんのjQueryのプラグインから、目的にあったものを探すのはなかなか大変ですよね。そんな時に役立つ便利なサイトをまとめました。 まずは手前ミソで自分がまとめたものから。 これは本当に多大な労力と実際の動作確認もしているので自信をもってオススメできます。 jQueryのプラグイン100選 -2013年総集編 日々チェックしているスクリプトから厳選して一年単位でjQueryのプラグインをカテゴリごとに選出しています。プラグインの半分近くは個別に記事も書いてあります。 jQueryのプラグイン100選 -2012年総集編 jQueryのプラグイン100選 -2011年総集編 jQueryのプラグイン100選 -2010年総集編 jQueryのプラグイン100選 -2009年総集編 jQueryのプラグイン100選 -2008年総集編
jQuery：jQueryでsubmit（サブミット）する方法 | raining
jQueryを使用し、フォームの値をsubmitする方法をメモします。 送信したいデータを変形や追加、バリデーションのチェックなど jQueryやjavascriptを使用するとデータを送信する前に処理することが可能です。 色々な用途で使用できます。 いつも忘れてしまうので、jQueryでformをsubmitする方法と javascriptでformをsubmitする方法をメモします。 ■ jQueryでsubmitする方法 【jQuery】 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#form1').submit(funct
[JS]これスゴイよ！スクロール時にさまざまな楽しいエフェクトを与えるスクリプト -ScrollMagic
スクロールに合わせて、さまざまなアニメーションをシンクロさせるjQueryのプラグインを紹介します。 Appleのプロダクトページのように次々に要素を表示したり、簡単にパララックスを加えたり、特定の要素をスクロール時にピンで留めて表示したりなど、スクロール系のエフェクトは全部できてしまう感じです。 スマフォなどレスポンシブ対応はもちろん、水平スクロール、無限スクロール、div要素の内側のスクロールなどにも対応しています。
[JS]日本語のどんなWebフォントでも美しくカーニングできるスクリプト -jQuery.Kerning.js
ウェブページで日本語のWebフォントを使用する時にカーニングを適用して、読みやすくて美しく表示するjQueryのプラグインを紹介します。 全角の括弧や句読点などの約物は、日本語のどんなフォントでもスクリプトのみで美しくカーニングできます。 ※文字間のカーニングは、フォントごとに設定が必要です。 jQuery.Kerning.js jQuery.Kerning.js -GitHub jQuery.Kerning.jsのデモ jQuery.Kerning.jsの使い方 jQuery.Kerning.jsのデモ デモでは上：カーニング無し、下：カーニング有りの状態で、明朝とゴシックの2書体がチェックできます。 適用されている方が、読みやすいですね。 ゴシック体のデモ、上：カーニング無し、下：カーニング有り jQuery.Kerning.jsの使い方 Step 1: 外部ファイル jquery.j
クリエイティブな動きがデザインが実装できる フリーjQueryプラグイン「30 Free jQuery Plugins for February 2014」
TOP > plugin > クリエイティブな動きがデザインが実装できる フリーjQueryプラグイン「30 Free jQuery Plugins for February 2014」 魅力的なwebサイトを実現させるためには、他にはないデザインや動きを取り入れることで、より理想に近づけることができます。今回はそんな魅力的な動きを実装できるフリーjQueryプラグイン「30 Free jQuery Plugins for February 2014」を紹介したいと思います。 （Drop） そのまま利用しても、自分のデザインと組み合わせて使っても、クリエイティブなwebサイトを作り出せるプラグインがまとめられています。 詳しくは以下 scrollReveal.js スクロールするとバーの動きを楽しむことができるプラグイン。個性的なデザインのサイトに仕上げたい時におすすめ。 leas
バニラJavaScriptを選択する
jQueryを用いて書いたコードと同等な働きをするコードをjQuery抜きで書くとどのようになるのかを示したWebサイト「You Might Not Need jQuery」（jQueryは必要ないかも）が先日話題になりました（はてなブックマークも180以上付いています）。 ちょうどこのWebサイトを話題にした記事「Choosing Vanilla JavaScript」が、Webデザイナ向けに情報発信をしている著名なWebサイト、A List Apartに掲載されていました。 Vanilla JavaScriptとは、要するに何もトッピングされていないバニラアイスクリームのように、jQueryなどのライブラリを使わない素のJavaScriptのことを示しています。 この記事は何でもjQueryを使うのではなく、正しい選択をしようというテーマの内容になっており、参考になりそうだったので翻訳
[jQuery]クリックイベントをセットする際に、後から追加する関数を先に実行させたい : nogunogu
今月はリファクタリング王・桜木と呼ばれてもいいんじゃないかというくらいのリファクタリングをやり遂げた男、のぐちです。 同時にバグ王とも呼ばれたとか呼ばれないとか。 さて、今回も実装派ブログです。 変なことをしてるかもしれないので、ご指摘などございましたらtwitter、@nogunogu_wap にお願いします。 問。 ボタンAとボタンBがあって、そこには既にクリックイベントが設定されているとします。 $("#btn_a").click(function() { alert("こんにちは"); }); $("#btn_b").click(function() { alert("こんばんは"); }); ボタンA、ボタンBの両方に、後から同じ関数を追加したいのですが、追加する関数は上記のものよりも先に実行して欲しいのです。 // そして、場合によっては上記の関数の実行をしないようにした
簡単実装でパララックスコンテンツを作成できるスクリプト -Parallax ImageScroll | コリス
ページをスクロールすると、パララックスのエフェクトで次々に画像とコンテンツをカーテンを引き上げるように表示するjQuerのプラグインを紹介します。 もちろんレスポンシブにも対応、またタッチデバイスではパララックスのエフェクトが重く感じることもあるのでオン・オフの設定もできます。 Parallax ImageScrollの使い方 Step 1: 外部ファイル </body>の上あたりに、jquery.jsと当スクリプトを外部ファイルとして記述します。 <body> ... コンテンツ ... <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="../jquery.imageScroll.js"></script> </body> Step2: HTML
[JS]スクリプト初心者でも簡単！レスポンシブ対応のナビゲーションやコンテンツを横から表示するスクリプト -Slidebars
最近よく見かけるトレンドの一つ「Off Canvas」、コンテンツの横からナビゲーションやコンテンツをアニメーションでスライド表示するjQueryのプラグインを紹介します。 デモページ：幅780pxで表示 Slidebarsの使い方 Step 1: 外部ファイル 当スタイルシートをhead内に、jquery.jsと当スクリプトを</body>の上に記述します。 <head> ... <link rel="stylesheet" href="slidebars.min.css"> <head> <body> ... <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="slidebars.min.js"></script> </body> St
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
//add メソッドで jQuery オブジェクト同士の結合が可能$('.aaa').add('.bbb'); - Pastebin.com
ふじこのプログラミング奮闘記