ある要素を自動的にスムーズにスクロールさせたいとき jQueryの animate() を使うことはよくある。例えば 200px だけしゅるしゅるっとスクロールさせたかったら以下のようなコードで可能。 $('#some_el').animate({ scrollTop: 200 }, 450); ここでもし、あるスクロールが jQuery の animate() による自動スクロールなのか、ユーザーがマウスでスクロールさせたものなのかを判別したかったとする。調べてみると、jQuery の :animated というセレクタを使うと判別できるらしい。 $('#some_el').on('scroll', function() { if ($(this).is(':animated')) { console.log('Scroll by animate()'); } else { consol
jquerymy.js ‹{}› A lightweight jQuery plugin for reactive two-way data binding. How jquerymy works jQuery.my is a plugin for reactive data binding. Plugin mutates object given as a data source to sync it with user interactions. Data bindings, facade appearance and CSS styling of an app are all defined using single manifest which is standard javascript object. Manifests are JSONable. $.my recognize
TouchSwipe a jQuery plugin for touch devices TouchSwipe is a jquery plugin to be used with jQuery on touch input devices such as iPad, iPhone etc. Features Detects swipes in 4 directions, "up", "down", "left" and "right" Detects pinches "in" and "out" Supports single finger or double finger touch events Supports click events both on the touchSwipe object and its child objects Definable threshold /
jQuery.ajax を使ってGETでリソースにアクセスした場合、IEでは2回目以降のリクエストが実際には発行されずにキャッシュされた結果が使われてしまいます。これを防ぐには $.ajax( { url : "http://example.com/", cache : false, data : { a : "abcd" }, ... } ); のように、cache オプションに false を指定すればいいようにドキュメント(http://docs.jquery.com/Ajax/jQuery.ajax#toptions)に書かれています。実際に cache : false を設定してみると、リクエストの発行される URL は、 http://example.com/?a=abcd&_=1253861397368 のようにクエリの末尾に現在時刻のミリ秒が付加されたものになります。 たい
概要 例えば横方向はposition:static、縦方向はposition:fixedのように見える動きを提供します。 ちょっと言葉だけでは分かりづらいので、デモをご覧ください。 ダウンロード jQuery.gpFloat-1.0.zip [57KB] 基本的な使い方 .gpFloatX()で横方向に、 .gpFloatY()で縦方向にのみスクロールするようになります。 $(elem).gpFloatX(); $(elem).gpFloatY(); デモ デモ1 : 基本的なもの Demo 1 上部のメジャーは、画面を縦にスクロールしても移動しませんが、横にスクロールした場合は一緒にスクロールします。 左部のメジャーも同様です。 下部のフッターは座標計算時にスクロール量を確認し、もし要素ブロックの右端までスクロールしていたら、それ以上はスクロールしません。 デモ2 : バルーン Demo
ViewerDecember 9 Viewew is an awesome jQuery image viewing plugin for photo galleries. Created by Fengyuan Chen Download Home Example View more → video-extendDecember 7 Video Extend is a jQuery plugin to create advanced video controls like jump to and chapters to videos Created by andchir Download Home Example View more → Casino pagination-jsDecember 5 Pagination-js is a Casino ohne Steuer jQuery
軽めのjQuery Advent Calendar 2012 16日目 Backbone.jsでattributesにオブジェクトを入れてハマった、っていうエントリーを書こうとしたら、ハマった僕を助けてくれたほかちゃんが先にBackbone.js Advent Calendarでエントリーを書きやがった書いてくれちゃったりしちゃったので、書くことがなくなった。 まあでも結局関連してるのって$.extend()のディープコピーだけなんで、あんまりよくわかってない人向けに書いておきます。書いてて結局これは誰向けの記事なんだろうと思い始めました。。 $.extend()って何ができんの 例えば $.extend(a, b) とかすると、aがbのこともできるようになります 。 具体的に var shino = { name: 'shino', age: 0, cry: function() { a
2 Blocks Template A template split in 2 animated blocks of content, inspired by dropbox.com/guide. Today's nugget is a simple template inspired by the awesome Dropbox Guide website. On bigger devices, the content is split in two main containers. When the user surfs through the content using the navigation, new content overlaps the old one. On smaller devices, we have a simple gallery of projects,
Select DOM elements by CSS selectorquerySelectorAll - a CSS selector method like the one provided by jQuery. jQuery: $(selector), $(selector, context) Select elements by class namegetElementsByClassName - a fast way of selecting DOM elements by class name in modern browsers. Does not work in IE 8 and below. jQuery: $('.foo') Select elements by tag namegetElementsByTagName - a fast and cross browse
AngularJS の勉強、始めました。 最初はそのプログラミングに関する独特のお約束事項にイラッとしましたが、キモであろう DI を「疎な関係のクラスを（実行時に）結びつけるのに必要な仕組み」と割り切り、DI – 猿でも分かる! Dependency Injection: 依存性の注入 で引用されている ITpro 記事 の クラス図 をコードから想像できるようになったところで、それなりに面白くなってきました。 何より「jQuery が要らなくなる！」のがとっても快感なんです （つらい時もあるけど…）。 さて今回は、jQuery まみれのページを AngularJS で書き換えた時に気付いた Ajax の動作 − 非同期通信の戻り値をいつどこで DOM に反映するか − に関する話題を書いてみます。 jQueryの場合 検索のクエリを渡すと Github のリポジトリを返す関数を例にとっ
事の発端。 jQueryの使わない機能があまりに多いのでカスタムビルドすることにした Sizzleも外せることを知る(容量がgzipで20KB分くらい減る) 外すと何が変わるか気になる <- いまここ ってなモチベーションで調べた一連の内容です。 jQueryとSizzleの関係 あらためて一応。 「jQueryといえば」な以下のようなコード。 var $hoge = $('#hoge'); // こういうのとか var $fuga = $('.fuga'); // こういうのとか $hoge.find('.foo'); // こういうのとか $hoge.text(); // 実はこういうのも そう、いわゆるこのセレクタの実態がSizzleなのです。 正確にはもう少し他のメソッドにも関係があります。 jquery/sizzle で、そのSizzleがjQueryの中でどういう動きをしてるか
この"easeInQuad"にあたる部分が、イージングです！ イージングを設定することで、動きに、勢いや波をつけることができます。 イージングを設定して、ボールを左右に動かしたものがこちら！ ちなみに、イージングがないとこんな感じです。 イージングを使いこなそう！ イージングは結構、種類が多いです。 例えば、jQuery Easing Pluginでは、なんと30種類以上のイージングが用意されています！ でも、30種類もあっても、ぱっと見、違いがよくわからないなんてことありませんか？ 今回は、私の独断と偏見で、jQuery Easing Pluginのイージングを中心に、 それぞれのイージングの特徴と、使いどころを紹介します！ ちょっと、注意事項 CSSや、jQueryでのアニメーションのやり方 今回はアニメーションのやり方そのものについては、説明を省き、イージングの話を中心に書きます。
jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application. If you're developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more tha
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
