タグ

jQueryに関するdeeekiのブックマーク (102)

  • opensocial-jquery - Google Code

    Code Archive Skip to content Google About Google Privacy Terms

  • jQuery基礎文法最速マスター[to-R]

    jQuery基礎文法最速マスター はやっているようなのでまとめてみたいと思います。 jQueryの読み込み Google AJAX Libraries APIで簡単に読み込めます。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> jQueryの記述場所 基的にはscript要素内の次の箇所に記述していきます。 <script type="text/javascript"> $(function(){ /*ここにjQueryを記述*/ }) </script> 上のコードは$(document).ready()のショートカットなので、次のように書いても大丈夫です。 <script type="text/javascri

    jQuery基礎文法最速マスター[to-R]
  • 機種依存文字や半角カナを変換する jQuery プラグインを書いてみた - Cyokodog :: Diary

    以下のような丸囲い数字や半角カナを、他の文字に変換する jQuery プラグインを書いてみました。 フォーム要素などでこれらの値が入力されるケースが良くあるのですが、環境によっては文字化けやトラブルの要因になるので、登録処理を行う前に代替の文字に強制変換するといった使い方をしています。 使い方 jquery.js 、jquery.exreplace.js を読み込み、変換対象の要素に対し exReplace() メソッドを実行すると、表のとおりの変換処理を行います。パラメータを指定することで、変換対象の文字を限定することができます。 Demo 保存ボタンを押した時点で変換したい場合は、保存ボタンの click イベント内で exReplace() メソッドを実行します。 jQuery(function($){ $('#save_btn').click(function(){ $('inpu

    機種依存文字や半角カナを変換する jQuery プラグインを書いてみた - Cyokodog :: Diary
  • jQuery1.4の新機能を1.4だけに14個 - KAYAC engineers' blog

    時が経つのは早いもので、ぼーとしてたらもう1月も終わりそうですね。外村です。 先日リリースされたjQuery1.4で新しく追加されたメソッドや新しい使い方ができるようになった機能を全部ではないですがいくつか紹介します。以下に変更点が全て掲載されているのでそちらも参照するといいと思います。 Version 1.4 ? jQuery API 新規で追加されたメソッド 1. nextUntil()、prevUntil()、parentsUntil() 指定したセレクタまでの要素を返します。以下の例ではitem3とitem4の後ろにテキストが追加されます。 <ul> <li id="item1">item1</li> <li id="item2">item2</li> <li id="item3">item3</li> <li id="item4">item4</li> <li id="item5

    jQuery1.4の新機能を1.4だけに14個 - KAYAC engineers' blog
  • フィードバック用の簡単なフォームをサイドからスライドさせるjQueryプラグイン・contactable

    Feedbackボタンをクリックするとサイド からフォームのパネルをスライドさせる jQueryプラグイン・contactableをご紹介 致します。情報元は去年の記事ですが、 自分が使いたかったのでメモ的にエントリ。 ユーザーにも優しいのでお勧めです。 わざわざページ移動せずともパッと送信出来るのでユーザビリティにも繋がりそうです。何より、インストールして使うので日語に出来るのは大きいですね。テキストを日語に直したデモをご用意しました。 デモ ※メールはダミーにしているので実際に送信は出来ません。 フォームテキストを日語に変えるには梱包されているjquery.contactable.packed.jsの中を変更します。ちょっと横長なので探し難いですが。。デモでは以下のように変更しました。 (function($){$.fn.contactable=function(options)

    フィードバック用の簡単なフォームをサイドからスライドさせるjQueryプラグイン・contactable
  • jQuery 642 プラグイン:skuare.net

    jQueryのプラグインを利用して出来るサンプルです。 jQueryは、John Resig によって開発されたJavaScriptライブラリで、AjaxやDOMプログラミングコードを「簡潔・簡単」に書けます。 ここでは、画像関連、メニュー関連、フォーム関連、テキスト/リンク関連、その他、日語未解説のjQueryプラグインを分類して紹介しています。 初心者でもすぐにリッチなサイトを作成可能ですので、ぜひjQueryプラグインをご利用ください Image Menu Form Text/Link Other W/O_JP

    jQuery 642 プラグイン:skuare.net
  • jQuery1.4aでのlive event/special event - monjudoh’s diary

    BPStudy#28 : ATNDの発表資料。 スライドなどは用意しておらず、これで発表する。 自己紹介 技術方面でのキーワード jQuery 主にevent周りを追っかけている Mercurial 俺々管理からチーム開発まで、開発をより上手くまわせるバージョン管理の仕方を追求中 Struts2 今仕事で使ってる 気に入った 技術者相手では名前で損してる印象 Python Be PROUD社員だったりDjango・Pyhonハッカソン、Python温泉によく参加してたりで誤解されがちだが全然書けない Perlの方がまだ書ける Be PROUD 株式会社ビープラウドの社員 ついったでbeproudハッシュタグ付き発言を時々している 今日の題jQuery1.4 先日jQuery1.4のアルファ版がリリースされた。 jQuery 1.4 Alpha 1 Released | Official

    jQuery1.4aでのlive event/special event - monjudoh’s diary
  • プラグイン API の定義パターンについて調べてみた - Cyokodog :: Diary

    jQuery の標準 API が DOM 操作等のコア機能に特化しているのに対し、プラグインとして提供される機能には、ウィジェット生成処理をはじめとした拡張機能的なものが多々あります。 また、このようなプラグインの中には内部的に生成した要素やメソッドに対し、外部から参照、実行が可能な API を用意し、プラグインに柔軟性や拡張性を持たせてるものもあります。 前回のエントリ(jQuery プラグインの定義パターンについて調べてみた)同様、公開されてるプラグインのソースを参照し、どのようなプラグイン API の定義パターンがあるか調べてみました。 ColorBox のプラグイン API を実際に使ってみる 定義パターンを見る前に、画像ギャラリー系プラグイン ColorBox の提供するプラグイン API を使用し、どんなことができるのか試してみます。 ColorBox は、画像ファイルにリンク

    プラグイン API の定義パターンについて調べてみた - Cyokodog :: Diary
  • jQuery プラグインの定義パターンについて調べてみた - Cyokodog :: Diary

    jQuery のプラグインの定義手法については、いろいろな記述の仕方が考えられるかと思います。今回、実際に公開されているソースを参照して、どのような定義パターンがあるのかを調べてみました。 jQuery 標準 API の定義構造のおさらい まず、jQuery が標準で提供している各種 API が、どうのような構造で定義されてるかおさらいしてみます。 $ や jQuery はグローバル変数、つまり window オブジェクトのプロパティ名であり、その実体は関数オブジェクトです。 window.$ = window.jQuery = function(){ ... } jQuery が提供する API には 関数 API と メソッド API があり、関数 API は jQuery 関数オブジェクト(以降 jQuery セレクタと記述します)が持つ、関数オブジェクトのことを指します。 jQue

    jQuery プラグインの定義パターンについて調べてみた - Cyokodog :: Diary
  • jQuery 開発者向けメモ - 基本・サンプル

    jQueryとは jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです. 独自のXPATH/CSSセレクタを利用することで,多くのDOM操作を非常に簡単に書くことが出来ます. JavaScriptのDOM操作や,XMLHTTPRequest,XMLの操作などを覚えなくとも, Ajaxを利用したインタラクティブなページを作ることが出来ます. 以下のサンプルを見れば,JavaScriptらしい表記をほとんどする必要がないことがわかると思います. toggleサンプル 特定のブロックの表示・非表示を切り替えるのは以下のようなコードになります. $("#target_toggle").toggle("slow"); このブロックは,<p id="target_toggle"> です. Ajaxサンプル Ajaxでhello.htmlをロードするのは以下のようなコ

  • https://atmarkit.itmedia.co.jp/ait/subtop/features/da/dt_jqueryref_index.html

  • 使ってはいけないjQueryの機能 5個 : tech.kayac.com - KAYAC engineers' blog

    3 days ago的な時間表記をするサービスは全部嫌いです。agoです。 週末若手IT勉強会に参加させていただきjQuery 1.3.2のイベント周りを読んできたので、それを踏まえて使用すると問題の発生する可能性の高い機能を紹介します。 0 jQuery.browser 1.3からサポート外になりました。 代わりにjQuery.supportを使用しましょう。 ただ、swfの重ね合わせ問題等は単体のJSでは確認できないので、jQuery.browser無しでどう解決すればいいのかよくわかっていません。 1 getData、setDataイベント getData、setDataイベントは1.5系で削除される予定のようです 最新版のjQueryではgetData、setDataイベントが使用可能になっており、以下のようにイベントを設定できます。 $().bind('getData', fun

    使ってはいけないjQueryの機能 5個 : tech.kayac.com - KAYAC engineers' blog
  • jQBinder, ブラウザー側でのHTML templateを可能にするjQuery plug-in

    一昨日はMVCの話で妙に盛り上がってしまったが、考えてみるとModel/View/Controller間の分離が不十分という話はサーバー側だけの話ではなく、クライアント側にも言える事。事実、私自身も div.innerHTML = "<span class='red'>" + message + "</span>"; みたいなHTMLが混ざったJavaScriptコードを書く事は良くある。特に、最近はJSONとして取得して来たデータセットをリストとして表示するケースが増えて来たが、そんな時に「サーバー側のようなHTMLテンプレートが使えたらいいな」と思う事は良くある。手っ取り早くとりあえず動くものを作るのにはHTML埋め込み型のJavaScriptで良いのかも知れないが、後々のメンテナンスを考えると少なくともModelとViewぐらいはキチンと切り話しておいた方が良い事は確か。 ということ

  • http://www.css-lecture.com/log/javascript/jquery-tooltip-image-preview.html

  • jQuery.autouploader Pluginを作成しました。 : tech.kayac.com - KAYAC engineers' blog

    AutoHotKeyの設定ファイルが意味不明で困ってます。agoです。 このたび弊社ではにおい部 - においフェチに捧げるコミュニティとして、におい部をOPENしました。 今回はこのサイトで使用している、ファイル選択時の自動プレビューjavascriptをjQuery.autouploaderとしてjQuery Plugin化したので公開したいと思います。 使い方はjQueryと一緒にpluginを読み込むだけ。 <script type="text/javascript"jquery.autouploader.js"></script> これで<form enctype="multipart/form-data">の中にある、<input type="file">に対して自動的にプレビュー機能が追加されます。 サーバサイドはアップロードされたファイルを保存し、そのURIを返すAPIを作成

    jQuery.autouploader Pluginを作成しました。 : tech.kayac.com - KAYAC engineers' blog
  • jQuery言語入門 : tech.kayac.com - KAYAC engineers' blog

    先月の社員PVランキングは91番目でした。agoです。 たまに他言語開発者から「JSは何となくわかるけど、jQueryが特殊すぎてよくわからない」という声を聞きます。 個人的にjQueryを使う場合、「JSの中でjQueryを使う」と言うより、「jQueryの中でJSを使う」と考えた方が理解しやすいと思うので、今日は"jQuery言語"の書き方を紹介したいと思います。 文法 Traversing methodでインデントを下げて、.end()でインデントをあげます。 (Traversing以外のmethodはインデントを維持します) そして、末尾には開始行と同じ位置に「;」を置きます。 $('body') .find('a') .filter('.permlink') .attr('href', function () { return $(this).attr('href').repla

    jQuery言語入門 : tech.kayac.com - KAYAC engineers' blog
  • [jQuery]フォームの入力欄にデフォルトで文字列を入れておいてフォーカスしたら消す | バシャログ。

    テキストフィールドの入力欄に「キーワードを入力してください」とかデフォルトで入れておいて、フォーカスした時に消す、というインターフェースを簡単に実装する jQuery のプラグインをご紹介します。 jquery.fieldtab.js 導入はとても簡単です。 まずは上記のサイトから「jquery.fieldtag.js」をダウンロード。 次に HTML の head 内に以下のコードを。#hoge のところは適用したいテキストフィールドの id を入れます。 <script type="text/javascript" src="jquery.fieldtag.js"></script> <script type="text/javascript"> /* <![CDATA[ */ $(function(){ $("#hoge").fieldtag(); }); /* ]]> */ </s

    [jQuery]フォームの入力欄にデフォルトで文字列を入れておいてフォーカスしたら消す | バシャログ。
  • jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog

    来週は私が夏休みなので更新はない予定です。agoです。 最近、人にjQueryを解説する機会があったので、昔を思い出してjQueryを使い始めた頃に感じる疑問を書いてみたいと思います。 1 そもそも何で使うの?いまでも困ってないよ 作成する内容にもよりますが、慣れると使用しない場合に比べて記述するコード量が3分の1程度まで減ります。 また、変数、条件分岐、繰り返しが減るのでバグが発生しにくくなります。 2 何か特殊なことができる? 結局できることは変わりません。 jQuery自体JSで書かれてますし、記述の自由度もJSの制約に制限されます。 3 何が難しいの? 文法がややjQuery的になります。 参考 jQuery言語入門 jQuery自体のコード量は少ないのですが、独特の記述法が多く慣れるまで多少時間がかかるかもしれません。 また、CSS Selectorの知識はほぼ必須です。 特にマ

    jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog
  • 細かすぎて伝わらないjQueryの機能5選 - KAYAC Engineers' Blog

    実は技術部ではなく、演出部所属のagoです。 先日jQuery 1.3.2のソースを読む機会があり、そのときいくつか気づいたことがあったのでまとめてみました。 1 .addClass, removeClassはスペース区切りで複数のclassを渡せる .addClass, removeClassにはスペース区切りで複数のclass nameが渡せます。 //classの順番は保持します。 //<div class="hoge gege">があった場合、<div class="hoge gege huga">になります。 $('div').addClass('hoge huga'); //<div class="hoge gege huga">があった場合、<div class="gege">になります。 $('div').removeClass('hoge huga'); ただし、hasC

    細かすぎて伝わらないjQueryの機能5選 - KAYAC Engineers' Blog
  • ASCII.jp:JSONP+jQueryで楽天アフィリエイトを攻略!

    自分が運営しているブログやWebサイトに、さまざまな商品のアフィリエイトリンクを張って紹介手数料を稼ぎたい。でも、URLを手動で書き換えるのは面倒だし、かといってリンクジェネレーターを使うとデザインや表示形式の制約が付いて回る――。 そこで活用したいのが、Amazon楽天、ヤフーなどが提供しているデベロッパー向けのWebサービスです。たとえば楽天が公開している「楽天ウェブサービス」を使うと、楽天で販売されている商品やサービスについてさまざまな情報を検索し、データを取得できます。 もちろん楽天ウェブサービスはアフィリエイトにも使えます。今回は、楽天ウェブサービスのごく簡単な使い方を紹介しましょう。 デベロッパーID/アフィリエイトIDの取得 楽天ウェブサービスでアフィリエイトを始めるには、始めに「デベロッパーID」と「アフィリエイトID」を取得します。 デベロッパーIDは、楽天ウェブサービ

    ASCII.jp:JSONP+jQueryで楽天アフィリエイトを攻略!