[jQuery] Chosen – セレクトボックスを便利にするプラグイン[jQuery] Chosen – セレクトボックスを便利にするプラグイン
セレクトボックスがかなり便利になる。むしろこれが標準でもいい。 Chosen: A jQuery Plugin by Harvest to Tame Unwieldy Select Boxes http://harves […]
カテゴリー: jQuery
[jQuery] セレクトボックスで選択したページにジャンプさせる (EasySelectBoxプラグイン使用)[jQuery] セレクトボックスで選択したページにジャンプさせる (EasySelectBoxプラグイン使用)
デザイナがEasySelectBoxというjQueryプラグインを推してきたので、プラグインの挙動チェックを兼ねて、前回のエントリの内容をEasySelectBoxプラグインを使うように修正してみる。 <scrip […]
[jQuery] セレクトボックスで選択したページにジャンプさせる[jQuery] セレクトボックスで選択したページにジャンプさせる
<script type="text/javascript"> $(document).ready(function(){ $('#site').bind('change', function() { win […]
[jQuery] サムネールをクリックするとメインの画像が入れ代わる[jQuery] サムネールをクリックするとメインの画像が入れ代わる
サムネールをクリックするとメインの画像が入れ代わる。 <img src="pic1.png" id="photo" /> <p> <img src="pic1.png" class="cho […]
[jQuery] jQuery Google Map – Google Map APIを操作するプラグイン[jQuery] jQuery Google Map – Google Map APIを操作するプラグイン
この先使うことがありそうな気がするので覚え書き。 jQuery Google Map http://tilotiti.github.io/jQuery-Google-Map/ 参考サイト ものっすごい簡単にGoogleマ […]
[jQuery] Tagsort – タグによる絞込み表示プラグイン[jQuery] Tagsort – タグによる絞込み表示プラグイン
フロントエンドだけでタグによる絞込み表示を行うjQueryプラグイン。この先使うことがありそうな気がするので覚え書き。 Tagsort jQuery Plugin – Will Haering http:// […]
[jQuery] フォームの最初の項目にフォーカスを与える[jQuery] フォームの最初の項目にフォーカスを与える
フォームを埋め込んだページがロードされたときには、フォームの最初の入力項目を自動でフォーカスするようにしておきたい。そうしておくことで、ユーザは入力欄をマウスで選択したりせずに、すぐにキーボードからタイピングを始められる […]
[jQuery] フォームをバリデーションするプラグイン[jQuery] フォームをバリデーションするプラグイン
こういうものは自前で実装するより、優れた有りモノを使うべきだろうな。ということで検索してみたけど、沢山ありすぎてどれを選べば良いのか迷う。だけど、プロジェクトがGitHubで運用されていれば、開発履歴にざっくり目を通すこ […]
[jQuery] jQuery逆引きリファレンス[jQuery] jQuery逆引きリファレンス
役立ちそうなリファレンスなので覚え書きリンク。ちょっと古い記事だけど (2009-2010年)。 Insider.NET > jQuery逆引きリファレンス – ＠IT http://www.atmar […]
[jQuery] Lazy Load – 画像を遅延ロードするプラグイン[jQuery] Lazy Load – 画像を遅延ロードするプラグイン
ウェブページに貼られている画像がスクロールされて、ブラウザの表示域に入ったときに初めてロードされることを Lazy Load と言うらしい。Pre-load の反対ね。日本語だと遅延ロードと呼ばれることが多いかな。 最近 […]
[jQuery] Zoom.js – 画像を滑らかにズームするプラグイン[jQuery] Zoom.js – 画像を滑らかにズームするプラグイン
動きが滑らかで見た目も良い。組み込みが簡単なのもいい感じ。 デモサイト http://fat.github.io/zoom.js/ fat/zoom.js https://github.com/fat/zoom.js 使 […]
[jQuery] AjaxでJSONデータを読み込む[jQuery] AjaxでJSONデータを読み込む
サンプル サーバーから最新のドル円レートをJSON形式で取得して、フロントエンドのUS$価格にJPY換算価格を付記する。 フロントエンド <script> $(function() { $.ajax({ ur […]
[jQuery] thisの子要素を取得する[jQuery] thisの子要素を取得する
$("foo",this) $(this).children("foo") $(this).find("foo") サンプル <script> $(function() { $(".item").click( […]
[jQuery] プラグイン内に関数を定義する[jQuery] プラグイン内に関数を定義する
サンプルコード jquery.showsize.js ;(function($) { $.fn.showsize = function(options) { console.log(this); var elements […]
[jQuery] プラグインでカスタムデータ属性を使う[jQuery] プラグインでカスタムデータ属性を使う
サンプルコード 要素ごとに異なるオプションを指定するためにカスタムデータ属性を使う。 <p><img src="sample.jpg" data-size="20"></p> < […]
[jQuery] プラグインにオプションを追加する[jQuery] プラグインにオプションを追加する
サンプルコード <p><img src="sample.jpg"></p> <script src="js/jquery.showsize.js"></script& […]
[jQuery] 機能をプラグイン化する[jQuery] 機能をプラグイン化する
サンプルコード 画像をクリックすると、画像の右上にサイズを表示する例題。 <p><img src="sample.jpg"></p> <script> $(function […]
[jQuery] 基本メモ: jQuery.getメソッド[jQuery] 基本メモ: jQuery.getメソッド
HTTP(GET)通信でページを読み込む。 jQuery.get( url, data, callback ) サンプルコード <p> <input type="text" name="name" id […]
[jQuery] 基本メモ: loadメソッド[jQuery] 基本メモ: loadメソッド
HTMLを読み込み、DOMに挿入する。 load( url, data, callback ) サンプルコード <button>Read More</button> <div id="res […]
[jQuery] 基本メモ: 動的に作成された要素にイベントを割り当てる[jQuery] 基本メモ: 動的に作成された要素にイベントを割り当てる
ドキュメントが読み込まれた時点で存在する要素に対しては、セレクタで選択してイベント関係のメソッドを使ってイベントハンドラを設定できる。しかし、動的に作成された要素(ドキュメント読み込み時点では存在していない要素)に対して […]