Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ……あら、いらっしゃい。 若いお客さんなんて珍しいわねえ。昔は、この街一番の人気店でね、若いお客さんもたくさんいたんだけどさ。最近はめっきり減っちゃってね。 何飲む？ ……水割り？ わかったわ。 じゃあさ、ちょっとだけ、あたしの昔話に付き合ってもらってもいいかしら。 What is jQuery? この店――『jQuery』がオープンしたのって、2006年なんだけどさ。その頃の、この街の様子って覚えてる？ ……知らないか。あなた、まだ若いもんね。その頃って、そりゃあヒドイもんだったのよ。 その頃、シェア率トップだったブラウザって、もちろ
序 師走ですね。年の瀬が近づいてくると、酔っ払った元社員に絡まれることが稀によくあります。 私は jQuery から Vue.js への置き換えで何をやらかしたのか - Qiita 可能ならいきなりフロントエンドのライブラリを導入するよりも jQuery のみで MVVM パターンへ移行したほうがよかったかなぁと今になると思います。 結局のところ、jQuery で苦しんでいたのは、複雑な「状態」が表示やイベントハンドル系のコードとごっちゃになっていたから です。 うん、分かる。当時、この取組みを「大変そうだなー」と思いながら横で眺めていました。 まさか、続きを自分でやることになるとは夢にも思っていませんでしたが(｡◉ᆺ◉) ごあいさつ どうも、 @cesare と申します。 クラウドワークスでサービスの開発や運用を手がける傍ら、たまに機械学習とか VR とかに手を出して遊んでいます。 この
jQueryが必要とされなくなってきたのは, Reactなどの他のフレームワークが登場したせいではなく, 標準DOM APIが進歩したおかげです JavaScript Advent Calendar 2017 - Qiitaの2日目の記事です. 何故この記事を書こうと思ったか JavaScriptの定番ライブラリであるjQueryは, 最近以前と比べて必要とされなくなってきました. その理由はよく, Reactなどの他のフレームワークが登場したせいだと勘違いされています. しかし, jQueryが必要とされなくなってきた理由は標準DOM APIの進歩によるものです. この記事ではそれを書いていきます. なお, この記事ではReact Nativeについて触れる必要がないため, React DOMのことも一緒くたにReactと記述します. また, 私がweb開発を開始したのは3年前ぐらいから
こんにちは Rails5.1に向けて、DHHのjqueryを依存から外す発言を発端にフロントエンド周りが急激に発展しているので、簡単にですがまとめてみました。 各issue, PRの詳細には踏み込みませんが、知見に溢れているので読んでみるの推奨です。 間違い、足りないものがあったら編集リクエストお願いします。 jQuery依存を無くす話が出る rails(issue): Drop jQuery as a dependency jquery-ujsはjqueryに依存しないようにする jquery-ujs: Drop jQuery as a dependency "jquery"-ujsじゃなくなったので名前変更 rails-ujs誕生 実際にRailsからjquery依存がなくなる rails: Drop jQuery as a dependency jsライブラリを入れる方法がnpmパッ
jQuery Gantt editor has been written by Roberto Bicchierai and Silvia Chelazzi These are some key features: jQuery based 3.2 MIT licensed: you can reuse everywhere https://opensource.org/licenses/MIT JSON import-export internationalizable manage task status –> project workflow manage dependencies manage assignments (resources, roles efforts) server synchronization ready full undo-redo support cros
npm install @fullcalendar/angular import { Component } from '@angular/core' import { CalendarOptions } from '@fullcalendar/angular' @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'] }) export class AppComponent { calendarOptions: CalendarOptions = { initialView: 'dayGridMonth', events: [ { title: 'event 1', date: '2019-04-01' }, { title: 'e
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
This gem does not work with Turbolinks 5+, and is not compatible with many jQuery plugins. We do not recommend using it. Instead, please consider writing your JavaScript in a way that makes it compatible with Turbolinks. These resources can help: RSJS - A reasonable structure for JS, a document outlining how to write JavaScript as "behaviors" that will be compatible with Turbolinks. onmount - 1kb
Google+ボタン はてなブックマークボタン 更新日時: 2015年01月07日（水） 作成日時: 2013年03月05日（火） 前の記事 / 次の記事 Rails4ではデフォルトでturbolinksが導入されるようなので、 どんなものかいじってみたら、なかなかエキサイティングだったけど、 他のJavaScriptと共存させようとすると結構デリケートだったので、それをまとめたメモ。 ※ v2.1.0未満のturbolinksでfirefox26以降で正常に動作しなくなる不具合あり。 ※ v2.2.1未満のturbolinksでfirefox27以降で正常に動作しなくなる不具合あり。 bundle update turbolinks 目次 この記事で言及する各ライブラリの場所 turbolinksとは何なのか？ 何が問題になるのか？ window.onload()が発火しない問題の解決
We’re getting things ready Loading your experience… This won’t take long.
問題 モバイルは回線が不安定なので、ロードの失敗が頻繁に起こります。 開発時は高速なwifi環境で開発しているので、リリース間近になって帯域を圧迫していることに気づいたりします。 解決方法 画像を先読みします var preload = function(src){ var d = $.Deferred(); var img = new Image; img.src= src; img.onload = d.resolve img.onerror = d.reject return d.promise(); }; 何をやっているかというと、空のimgタグをつくってそこに画像を読み込みます。その過程でブラウザキャッシュに画像が保存されます。正確に言うとこの時点ではどこにも紐付いていないのでGC対象ですが、その後すぐDOMに画像をはるなら問題ありません。 並列で先読みする(速い・不安定) va
jQuery UI Sortableを使えば、直感的にマウスでドラッグアンドドロップしてアイテム（行）を入れ替えられるようなWebページが作成できます。 念のため説明しておくと、 jQuery UI Sortableは、jQuery UIのなかのひとつのフィーチャーです。 jQuery UIは、jQueryのプラグイン（ライブラリの一つ）です。 jQuery UI Sortableを使用するには、jQueryとjQuery UIを読み込むか、 以下のようにjquery.ui.sortable.jsが依存している「core」「widget」「mouse」だけを読み込めば軽くなります。 <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src=
あるいは kanazawa.js v1.0.1 勉強会 : ATND に参加してきた。（前回と同じパターンの使い回し） なぜdispatcher（あるいは router）か実はピンときてなかったけど、なんかこういう手法があるっぽいということだけ知ってた。 pixiv Tech MeetingでpixivのJSの話をしました から辿れるスライドを見てなるほどなと思った。自分がいちばんなるほどと思ったのは WAFの不自由さ というか layout ファイルの <script> を可変にできるように仕組み用意していちいちそこに何か文字送ったりするのってめんどくさいよねというか、要するに script loading も DRY に ってことじゃないかな。もっかい整理すると layout ファイルで JavaScript のライブラリの読み込みは共通にできるでも layout ファイルの中に手を出
jqueryプラグインのJcropを使うとIMG要素の画像を切り抜き（クロップ）できるので便利。 使い方は別のサイトにお任せするとしてハマった点をメモ。 $(query).Jcrop()とすると、queryにマッチした要素は最初のJcropの呼び出し時にコピーされ、コピー先の要素ではid属性は削除される。そして2回目以降はコピーされない。 で、結論から言うと、queryにid以外を使う場合は最初にクエリを投げてその結果を使いまわすようにする必要がある。たとえばこういうこと: var i = 3; var $foo = $(".foo") while(i-- > 0) { $foo.Jcrop() } なぜかというと、 var i = 3; while(i-- > 0) { $(".foo").Jcrop() } と書いた場合、次のようにコピーが3回行われることになるため: // 1回目 /
2013年05月08日18:21 JavaScript 実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 さて、先日簡単なチュートリアル作ろうと思ったんですが、どうやるのが良いのかなーと思って悩んでました。キャプチャ取ってそこに説明文を書いて…ってしてもいいんですけど、キャプチャだと一部分なのでサイト上のどの辺なのかわかりにくかったり、サイト側は変更したのにキャプチャが古いままとかになったりしちゃいますよね＞＜ とか思って探してみたらこちらの Intro.js が便利だったので紹介してみます。 さて、この Intro.js を使うとですね、サイト上で動作するチュートリアルを簡単に作れるんですよ。使い方も簡単で、動作させたい要素に対して data-intro (表示する説明文) と data-step (チュートリアルの何番目に表示するか) を指定します。チ
なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密
日本のAmazonでも採用されているメガドロップダウンメニューについて、なぜAmazonのメニューはユーザーが使いやすくできているのかという秘密が明らかになりました。ユーザビリティを改善することが至上命題のネットショッピング系サイトにとっては非常に有益な知識となっています。 Breaking down Amazon’s mega dropdown - Ben Kamens http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown まずこれがAmazonの左上にあるカテゴリーを一覧化したメガドロップダウンメニュー。日本のAmazonにも同様のメニューが採用されており、マウスカーソルを上に持っていくと実にスムーズに動きます。 通常のメニューの場合、以下のようにして少し遅れてサブメニューが開くようになっています。 な
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
