そのコード、本当にjQueryが必要ですか？ネイティブ関数の代替Tips集 | ゆっくりと…
sitepoint から「本当にjQueryが必要ですか？」とタイトルのついた3本の記事を紹介します。 Do You Really Need jQuery? Native JavaScript Equivalents of jQuery Methods: the DOM and Forms Native JavaScript Equivalents of jQuery Methods: Events, Ajax and Utilities 言うまでもなく著者の Craig Buckler さん の趣旨は、「jQueryを使うのは止めよう」ではありません。ネイティブ関数で代替えできるのは、古い IE のサポートが必要なく、ごく簡単なケースに限られます。その代わりに得るものは「速さ」です。そこで、どの程度「速い」のかを所々 jsperf の結果で補ってみたいと思います。 また JavaScri
一行入魂 jQueryでselect操作まとめ
HTMLのselect要素であるコンボボックスをjQueryで扱いたくて色々調べました。 一覧で見られると便利なので、まとめてみました。 <select id="target"></select> ■要素の追加 jQuery('#target').append(jQuery('<option value="1">test1</option>')); ■要素の選択 value=1を選択 jQuery('#target').val('1'); ■要素の変更のイベントハンドラー jQuery('#target').bind('change', function() { }); ■選択された要素の取得 属性valueの値 jQuery('#target option:selected').val(); テキストの内容 jQuery('#target option:selected').text()
ハリーポッターシリーズの映画の見る順番はこれで完璧！原作と違うの？
★こちらも注目！ → シングの映画の登場人物（キャラクター）の名前一覧！ ハリーポッター映画シリーズは、魔法の世界を舞台にした冒険物語であり、多くの人々を魅了してきました。その中でも、最終章となる「ハ リーポッターと死の秘宝 Part2」は、感動的なエピローグを描いた作品として、多くのファンから高い評価を受けています。 この映画は、ハリーたちがヴォルデモートとの最終決戦に挑む姿を描いたものであり、シリーズの中でも最も重要な作品の一つです。ハリーた ちは、過去の出来事や自分たちの運命に向き合いながら、勇気と友情を胸に戦いを繰り広げます。 また、この映画は、シリーズの中でも最も感動的なシーンが多く含まれています。ハリーたちの友情や愛情、そして最後には、ハリーたちが成 長していく姿が描かれています。そして、最後には、ハリーたちが自分たちの運命に向き合い、勝利を手にする姿が描かれています。 「ハリ
jQuery.extend マニアックス
jQuery の extend メソッドは便利なんだが複雑で忘れてしまいがちなのでメモしておく。 jQuery.extend の呼び出しパターンは次の４通り。 $.extend([deep,] target, obj1, [obj2, [obj3, ...]])$.extend([deep,] obj)$.fn.extend([deep,] obj)$(...).extend([deep,] obj) 全てのパターンで第一引数に [deep,] がある。これはオプションの引数で true を指定するとディープコピーしてくれる。 以下では分かりやすくするために deep オプションは省略した一覧を掲載する。 $.extend(target, obj1, [obj2, ...]])$.extend(obj)$.fn.extend(obj)$(...).extend(obj) だいぶシンプルにな
jQueryのプラグインをつくってみよう - tumblr
僕はiPhoneとかiPadとかmacみたいな流行りものを使用すると蕁麻疹が全身に出てさらに左腕が疼きだすという特異体質(別名：天邪鬼)のため、これまであまりjQueryは使ったことがなかったです。特異体質によるものもあったのですが、僕みたいなグズがjQueryのような便利なものに手を出したら、面倒なコードを書くにもjQuery頼りになって自分でコードを書く努力を怠る習慣が身についてしまうのでは、という懸念があったためです。最近になってようやく、本当に多少ではありますが独力である程度の処理は書けるし読めるようにもなったので、効率化のためにもjQueryをもっと使っていこうという気になったわけであります。 で、そうなるとやはりjQueryが提供する便利関数では全然足りなくて自分でプラグインを書きたくなるわけです。ちょうどjQueryの公式サイトにjQueryプラグインの作り方指南な記事(ht
imagesLoaded
imagesLoaded JavaScript is all like "You images done yet or what?" imagesloaded.desandro.com Detect when images have been loaded. imagesLoaded on GitHub 8,000 Edit this demo or vanilla JS demo on CodePen. Just to keep things interesting, there’s a 10% chance of adding a broken image. Install Download imagesloaded.pkgd.min.js minified imagesloaded.pkgd.js un-minified CDN <script src="https://unpkg.
Columnizer jQuery Plugin – Adam Wulf
The Columnizer jQuery Plugin will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns. And, of course, it’s easy to use! Has Columnizer helped you build your website? Send me a coffee and become a sponsor on Github! Thanks for your support! ☕️ 🙌 Get the source Available on Github at https://github.com/adamwulf/Columnizer-
jQuery hashchange event を使ってみた。 - Toro_Unit
昨日やっていたHTML5とJavaScriptの切っても切れない関係/CPI x CSS Nite「After Dark」（1）で紹介されていたjQuery hashchange event のデモを早速作ってみました。 https://torounit.com/demo/hashtag/ 1/24:スクリプトエラーを修正しました。 制作に当たっては5509様のところの Ajaxやタブ切替には必須かも？ブラウザの「戻る」「進む」を有効にするjQueryのhashchangeプラグイン を参考にさせてもらっていますです。 [js] $(function(){ $(window).hashchange(function() { $("hoge").load(location.hash.replace(‘#’, ”)+ "hogehoge"); }); $(window).hashchange(
.remove() | jQuery 1.9 日本語リファレンス | js STUDIO
マッチした要素を削除します。 .remove([ selector ]) 1.0追加 デモ .empty()との違いは、.remove()はマッチしている自身の要素も含めて、子要素も全て削除します。 また、削除対象の要素に紐付けられているDataやイベントもハンドラも削除します。 もし、紐付けられているものを残しておきたい場合は、.detach()を使用してください。 .remove([ selector ]) 1.0追加 戻り値:jQuery 引数 説明 <div class="container"> <div class="hello">こんにちは</div> <div class="goodbye">さようなら</div> </div> 次のように削除処理を実行します。 $('.hello').remove(); 結果は下記のように該当したDIV要素が削除されます。 <div cla
.wrap() | jQuery 1.9 日本語リファレンス | js STUDIO
サンプル 次のようなコードがあった場合、 <div class="container"> <div class="inner">こんにちは</div> <div class="inner">さようなら</div> </div> 下記の処理を実行すると、 $('.inner').wrap('<div class="new" />'); マッチした要素それぞれが指定したDIVで囲まれます。 <div class="container"> <div class="new"> <div class="inner">こんにちは</div> </div> <div class="new"> <div class="inner">さようなら</div> </div> </div> 下記のように引数に関数を指定した場合、 $('.inner').wrap(function(index) { return
第4回 要素の操作＆ユーティリティ編
連載目次 現在の要素セット（カレント要素）を指定された要素で囲むには、、wrap／wrapAll／wrapInnerメソッドを利用します。引数htmlには、HTML文字列のほか、DOM Elementオブジェクトを指定することもできます。 それぞれの違いについては、実際の動作を確認した方が早いと思いますので、まずは具体的な例を見てみましょう。以下は、既存の<p>要素に対して、枠線付きの<div>要素を追加する例です。 <script type="text/javascript"> $(function() { $('#wrap > p').wrap( $('<div></div>').css('border', 'solid 1px Blue') ); // 個別の要素にラップ $('#wrapAll > p').wrapAll( $('<div></div>').css('border'
jQuery 1.9 日本語リファレンス | js STUDIO
このサイトについて jQueryの日本語リファレンスです。 jQueryの本家サイト(英文) の内容を翻訳して作成していますが、誤訳や誤記があると思いますのでその点についてはご了承ください。 もし、誤訳などの間違いを見つけましたら、 @tomof まで教えていただければ幸いです。 News 2013.03.13 ver1.9の内容に更新しました。 2012.12.02 jQueryの似ているAPIまとめ 2012.10.13 サイトをオープンしました。 API APIのカテゴリー分けについては、本家サイトでは1つのAPIが複数のカテゴリーに所属していますが、 このリファレンスでは分かりやすさを重視して1つのカテゴリーに絞っています。 また、一部本家サイトのカテゴリーを削り、別のカテゴリーに所属させているAPIがありますので、 予めご了承ください。 Ajax Ajaxに関する処理 Attri
jQueryのbind/live/delegateの違いまとめ、と新API .on()の使い方 - y-kawazの日記
jQueryのイベント記述方法はいくつかあり、大雑把におさらいしたのが以下の3パターンです。 まず一番基本的なのが $("a").click(fn) や $("a").bind('click', fn) です。click(fn)はbind('click', fn)の省略形です。 次にjQuery1.3で $("a").live("click", fn) という機能が出来ました。liveの良いところはDOM操作で出たり消えたりするエレメントに対して再バインド無しでイベント定義ができる利便性と、内部的にはbind個所がdocumentの1か所になり複数個所へのbindが無くなることによるメモリ効率と実効速度の向上です。 更にjQuery1.4.2で $("#foo").delegate("a", "click", fn) という書き方が出来るようになりました。これは特定要素以下に限定するliv
Using jQuery Stop
Full Cycle of Animation on Hover/Off Goals: Animate wide on mouseEnter Animate back on mouseLeave No matter what, perform a complete wide/back cycle Not queue up animations on multiple hovers Be smooth NOT Using .stop(); The smoothness of this is perfect, but the animations queue up. $("div").hover(function(){ $(this).animate({ width: "200px" }); }, function() { $(this).animate({ width: "100px" })
5509
割とアップルの製品は好きだし、好きだっただけにこんなにがっかりしたことは初めて。 発端 ことの発端は仕事で使っているMacBook Airが液晶割れしてしまったことで 液晶割れっていくらになるんだろうとか思いながら、アップルストア渋谷店に持っていったところ 40000円弱ですね、とのこと。 お金かかるだろうなっていうのは分かってたしそれはまー仕方ないからおいとくとして、スリープから復帰しないっていう別の致命的な不具合もあったのでそれ見てもらった。 で、こっちは無償で修理しますんでっていうことでお願いして、1週間後くらいに連絡もらって取りに行きました。 最初のミス その場で簡単に検証して ロジックボード変えたので大丈夫だと思いますみたいなこと聞いて まーまた不具合あったら持ってきますわーって言って持って帰ったんですけど なんかこのMacBook Air処理が遅い気がする・・・ で、この時は検
Ben Alman » jQuery hashchange event
This jQuery plugin enables very basic bookmarkable #hash history via a cross-browser HTML5 window.onhashchange event. While this functionality was initially tied to the jQuery BBQ plugin, the event.special window.onhashchange functionality has now been broken out into a separate plugin for users who want just the basic event & back button support, without all the extra awesomeness that BBQ provide
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Scott Robbin
http://moriwaki.net/cms/?p=503
GitHub - desandro/imagesloaded: :camera: JavaScript is all like "You images done yet or what?"
jQueryで破棄されたrequestAnimationFrameとJSでのアニメーション実装で注意すること