いよいよ正式版が登場！ jQuery 3での変更点と前バージョンからの移行のポイント
何が変わったか（概要） jQuery 3.0では、非推奨としていたAPIやドキュメントになかったAPIを削除したり、全体的にAPIを整理してバグを修正しています。また一部のAPIでは、大きな仕様変更があります。既存のコードを動作させる場合には注意が必要ですので、まず移行プラグインをバージョンアップ対応ツールとして使って、影響具合を確認することをお勧めします。 なお、jQuery 3.0での特に大きな変更点は、次のとおりです。 バージョンの1本化 Deferred機能が「Promises/A+」仕様に準拠 非推奨のload、unload、errorを削除して、onメソッドに統一 カスタムセレクタの高速化 既存コードからの移行 既存のコードを移行できるように、Ver3用移行プラグインがリリースされています。このプラグインでは、影響のあるコードに対して警告がブラウザのコンソールに表示されますので
jQuery 3.0 Final Released! | Official jQuery Blog
jQuery 3.0 is now released! This version has been in the works since October 2014. We set out to create a slimmer, faster version of jQuery (with backwards compatibility in mind). We’ve removed all of the old IE workarounds and taken advantage of some of the more modern web APIs where it made sense. It is a continuation of the 2.x branch, but with a few breaking changes that we felt were long over
CSSだけで画像をトリミングする方法3つとjQueryを使う方法1つ | Cappee Design
@cappeeです。 特にシステム案件のコーディングだと、縦横比が異なる画像を扱う場合も多いと思います。 例えばユーザー画像などを正方形で表示したい場合、アップされる元画像はユーザに委ねられるので画像のサイズや縦横比は様々になると思います。アップしたタイミングで画像を加工できるならいいですが、そうでない場合、見た目を整えるためにCSSで同じサイズにトリミングしてしまいましょう。 トリミングにもCSSだけで3つのやり方があるので、状況によって使い分けたいですね。 overflow: hidden を使う 一番オーソドックスなやり方がoverflow: hidden を使ってトリミングする方法です。 trimming というクラス名が入ったトリミングする枠用のタグはブロック要素である必要がありますので、もしインライン要素に指定する場合は、CSSに display: block; も追加してく
jQuery.ajax()でファイルをアップロードする方法
jQuery.ajax()でファイルをアップロードする方法を紹介します。 １．はじめに jQuery.ajax()で画像ファイルをサーバに送信し、バックエンドのPHPで画像の幅・高さを返却し、それを表示するという簡単なプログラムを組んでみました。 フロントエンド <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> <script> $(function(){ $('#foo').submit(function(){ $.ajax({ url: "test.php", type: 'POST', data: { 'file': $('#file').val() }, dataType: 'json' }) .done(function( data ) { $('#re
jQueryにおけるattrとpropの違いと使いドコロまとめ - Qiita
checkboxやradioのチェック状態を調べる際にはattrではなくpropを使うのが良い。 attrでも取れないこともないですが、propで取得する方が処理が早いです。 特にIEの場合、inputに対するdisabledの処理がものすごく重く、attrでdisabledやcheckedの処理を沢山していると、無駄に最悪な感じで負荷がかかります。 attrとpropの取得の違い またこの２つは、同じ値を取得してるようで異なる値を取得するので注意。 例えば //チェックした値を取得するよー $(":checkbox").click(function() { alert($(this).prop('checked')); alert($(this).attr('checked')); }); の場合、 チェック時 prop true attr checked 非チェック時 prop fal
爆速でわかるjQuery.Deferred超入門
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。これまで、JavaScriptで非同期処理を書く上での問題として、コールバック地獄やエラー処理に例外が使えないことなどを解説してきました。 これらの問題に対処するライブラリの1つであるjQuery.Deferredに関して、もう少し丁寧に解説いたします。なお、jQueryのバージョンは記事執筆時点の最新である、1.9.1を想定しています。 jQuery.Deferredとは jQuery.DeferredとはjQueryのバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。使いこなすことで、以下のような効果が見込めます。 非同期処理を連結
[JS]これスゴイよ！スクロール時にさまざまな楽しいエフェクトを与えるスクリプト -ScrollMagic
スクロールに合わせて、さまざまなアニメーションをシンクロさせるjQueryのプラグインを紹介します。 Appleのプロダクトページのように次々に要素を表示したり、簡単にパララックスを加えたり、特定の要素をスクロール時にピンで留めて表示したりなど、スクロール系のエフェクトは全部できてしまう感じです。 スマフォなどレスポンシブ対応はもちろん、水平スクロール、無限スクロール、div要素の内側のスクロールなどにも対応しています。
jQueryのテンプレートプラグイン「jquery-tmpl」を使ってみた (多分)その1 - 黒羊工房はてな版
追記：続編書きました。 リンクは一番下に 最近jQueryにはまっているひつじです。こんにちは。 jQueryに限らず、JavascriptでDOMをいじっていると var name = 'bsheep'; $('<div>').addClass('name').text(name).appendTo('#profile'); // // <div id="profile"></div> // ↓ // <div id="profile"><div class="name">bsheep</div></div> // こんな感じでDOMをその場で生成して埋め込みとかいう操作が結構あります。 でも、こういうの書いているとHTMLとscriptとを分離したくなってきますよね！ この書き方のまま複雑なものとか作ってると、できあがりのHTMLの構造を読み取るための思考コストがかなり必
配列をn個ずつの配列に分割して、それをまとめた配列を作る
前の記事『ブクログのブログパーツAPIを使ってスライドする本棚を作る』を書いたとき、配列をn個ずつの配列に分割して、それをまとめた配列を作る、という処理をやったのですが、そのときのメモです。 「1つの配列をn個ずつに分割したい」みたいなことをTwitterに書いたら、 @hell2uさんから 破壊していいならn回shiftしてまとめたのを後ろに追加をループでいいんじゃないか @GeckoTangさんから sliceしてpush と言われたので、両方やってみました。 ちなみに、スライド本棚ではshift & pushと似たような処理にしました。 例として、以下の配列を使います。 var baseArr = ['AAA', 'BBB', 'CCC', ... 'XXX', 'YYY', 'ZZZ'];これを3つずつの9個に分割したいと思います。 shiftしてpush（破壊的）var b =
iOSのホーム画面に作るフォルダっぽいやつを実装するjQueryライブラリ・App Folders
iPhoneやiPadのホーム画面に作れるフォルダっぽい動作のコンテンツを実装出来る、というスクリプト。動作はかなり再現出来てる気がします。 iOSのホーム画面に作られるフォルダっぽいのを作る、というjQueryプラグインです。 ※ドラッグで動かせる、というのは残念ながら付いてないです。 フォルダをクリックすると開く的なやつです。 ↑ 開いた箇所はハイライトされる コード<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js'></script> <script src="jquery.app-folders.js"></script>本体とライブラリｗ読み込む $('.foo').appFolders({ opacity: .2, // セレクト
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>
日付のvalidate - 超自己満足プログラミング
入力文字列が存在する日付かどうかを判定する こんな感じでどうだろう function validDate(str) { var ymd = str.split('/'); // 年月日のデリミタでsplit. var y = ymd[0]; var m = parseInt(ymd[1],10) - 1; // 0 paddingされてる文字列を整数に. "09" => 9 var d = parseInt(ymd[2],10); var vd = new Date(y, m, d); if (vd.toString()!='Invalid Date' && vd.getFullYear()==y && vd.getMonth()==m && vd.getDate()==d) { return true; } alert('Invalid Date'); return false; } 使
Dialog - jQuery UI API 1.8.4 日本語リファレンス - StackTrace
解説 高機能なダイアログウィジェットです。 dialog は、タイトルバーとコンテンツエリアを持つ、フローティングウィンドウです。 デフォルトでは、移動、リサイズすることができ、右上の "x" ボタンでウィンドウを閉じることができます。 コンテンツの大きさが最大値を超えた場合は、スクロールバーが自動的に表示されます。 書式 依存ファイル jquery.ui.core.js jquery.ui.widget.js jquery.ui.mouse.js jquery.ui.position.js jquery.ui.draggable.jsオプション jquery.ui.resizable.jsオプション 引数 optionsオプション 関数 String: "destroy"、 "disable"、"enable"、"option"、"widget"、"close", "isOpen", "
クロスブラウザでファイルのドラッグ＆ドロップ、Ajaxアップロードを可能にする「FileDrop」:phpspot開発日誌
クロスブラウザでファイルのドラッグ＆ドロップ、Ajaxアップロードを可能にする「FileDrop」 2012年08月24日- FileDrop ? cross-browser JavaScript Drag & Drop file upload ? Блог Прогера クロスブラウザでファイルのドラッグ＆ドロップ、Ajaxアップロードを可能にする「FileDrop」。 対応ブラウザであれば以下のブラウザでドラッグ＆ドロップによるファイルアップロードが可能になります。どのJSフレームワークにも依存せず単体で使えます。 IEではIFrameを利用した画面遷移なしのファイルアップロードが可能。 ファイルをドロップすると、各種イベントハンドラが起動されて、タイミングに応じた好きな処理を記述することも出来るみたい。 関連エントリ HTML5を使ったファイルアップロード用プログラム集 jQuer
【jquery】テキストボックスのデフォルト文字。クリックすると消えるよくあるヤツ | PIYOPI-YO 〜プログラマー風メモブログ〜
タイトルがイケてないですが、よくあるあれです。 伝わりますか？ jqueryで書いてます。すごく楽です。 <html> <head> <title>jquery よくあるあれ</title> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.2.6");</script> <script language="Javascript" type="text/javascript"> <!-- $(function(){ //初期値の文字色 var d_color = '#999999'; //通常入力時の文字色 var f_color = '#000000'; $('#textbox'
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://webrecipe.net/textblur/
GitHub - ottonascarella/textblur: jQuery Plugin that makes adding Blur Filter to text elements an easy task.
Loading...
finefinefine.jp
http://www.aaronvanderzwan.com/maximage/