Code Archive Skip to content Google About Google Privacy Terms
JavaScriptjQuery を使って JSONP でリクエストする方法を2通り紹介するよ。その1: $("")createElement を $() を使って実装。 $("") .attr('type', 'text/javascript') .attr('src', "http://www.example.com/jsonp.cgi?param1=value1&callback=myCallback") .appendTo($("head")); function myCallback(json){ // ロード完了時にここが呼ばれる } http://www.example.com/jsonp.cgi?param1=value1&callback=myCallback にリクエストがいく。callback のところは、サービスによって指定の仕方が違うかもね。その2: $.ajax
料金表や一覧を表示する際に欠かせないテーブルコーディングで、検索や並び替え、ページング、グラフ表示など色々なものがあったので、探しやすいようにjQueryプラグインをまとめてみました! jQuery Visualize HTML5とjQueryを使ってテーブルの値をグラフで表示する事が出来ます。 jquery.csv2table.js エクセルなどで作ったCSVファイルを読み込み、クロスブラウザなテーブル表示を行うjQueryプラグイン。 行の絞り込みや文字列検索などかなり高機能になっています。 jExpand 表、画像、リスト、図やその他の要素を折りたたみ表示する事ができます。 Fixed Header Tables ヘッダーを固定して表示します。Excelでは良く使いますね。 縦に長い表を使う場合に非常に便利です。 treeTable テーブルの中にツリー構造を実装できます。 Flex
よく見かけるタイプのjQueryを使ったスクロールしても上に固定されているメニューを紹介します。最近FC2ブログの上部に現れた検索バー(このブログは非表示にしてます)みたいな感じです。 <script type="text/javascript"> $(function() { $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop != 0) $('#nav').stop().animate({'opacity':'0.5'},400); //スクロール時 else $('#nav').stop().animate({'opacity':'1'},400); //一番上にあるとき }); $('#nav').hover( function (e) { var scrollTop =
jqGridは、JavaScriptライブラリであるjQueryのプラグインで、リッチな感じのテーブルだ。見た目、結構かっこ良さ気なんだよね。Excelっぽくて。 こいつを使って、DBを検索した結果を表示してみようと思った。 ■参照したサイト jQuery本家 JavaScriptライブラリjQueryや、jQueryベースのテーマフレームワークjQuery UIを、ダウンロードできたりマニュアル読めたり。ただし全部英語。 jQuery日本語リファレンス jQueryの日本語リファレンスのサイト。本家の英語の翻訳に疲れたときに利用。お世話になってます。 jqGrid配布元 jQueryプラグインのjqGridのダウンロードとか最新版のリリース情報とか。英語サイト。 jqGrid Wiki jqGridの使い方とかリファレンスとか。インストールや最初の一歩的簡単な使い方から書かれてる。英語サ
jqGrid 4.0 New search module, Tree Grid and SubGrid improvements, new colModel cellattr event and much more... Enjoy Please, support the jqGrid project by clicking on our sponsors ad!
2010年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年は、アニメーションのエフェクトやレイアウト、後半は背景画像関連のプラグインが特に目立っていたように思います。 [ad#ad-2] コンテンツスライダー・カルーセル関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 ツールチップ関連 レイアウト関連 背景画像関連 その他UI関連 アニメーション関連 スクロール・ドラッグなど操作関連 テーブル・リスト・データ関連 フォーム関連 コンテンツ生成 その他 コンテンツスライダー・カルーセル関連
jQueryを良くする25のTIPS ネタ元:Improve your jQuery - 25 excellent tips ちょっと多いですが、かなり良いTIPSがまとまっています。 Google AJAX Libraries APIを利用しよう Google AJAX Libraries APIを活用すればすばやくライブラリを読み込むことが出来ます。 <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> // Load jQuery google.load("jquery", "1.2.6"); google.setOnLoadCallback(function() { // Your code goes here. }); </script> 直接読み込むことも出来ます。
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」 2010年03月11日- Run This! PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」。 ブラウザ内の<pre>コードで記述した部分を、その場でそのまま動かすことができ、うまくサイトに組み込めばより訪問者にとってわかりやすいページを作ることが出来そうです。 例えば、PHPの入門サイトなんかでは挙動を一瞬で確認できてしまいます。 具体的には以下の言語に対応しています。 Ada, Assembler, AWK, Bash, bc, Brainf**k, C, C#, C++, CLIPS, Clojure, COBOL, Common Lisp, D, Erlang, Forth
Meta See the related blog post: Under jQuery's Bonnet I was sick and tired of having to scroll through a raw copy of jQuery everytime I wanted to view a method's implementation... so I decided to have a go at creating a faster, more usable interface which would allow me to quickly traverse each method's source. It's dead simple. Type in a jQuery method name (then wait a bit) and the corresponding
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
2010年1月14日、jQueryの最新版1.4がリリースされました。 本家のサイトをはじめ、新機能のサンプルコードや1.3.2との後方互換について紹介します。 jQuery 1.4 Released jQuery 1.4のダウンロードとリリース情報 jQuery 1.4のダウンロードや詳細な情報は、下記ページをご覧ください。 jQuery 1.4 Released – The 14 Days of jQuery 性能は1.3.2と比較して、上のキャプチャのようにほとんどの面でパフォーマンスがより改善されたものとのことです。 jQuery 1.4 API チートシート jQuery 1.4に対応したチートシートです。 PDF版とPNG版も用意されています。
jQueryは近年、JavaScriptライブラリの中でも高い人気を持ち、急速に普及してきたライブラリです。jQuery自体はオープンソースで開発が進められるライブラリですが、2008年9月にマイクロソフトが正式サポートすることを表明したことから、今後は、ASP.NETの世界でも採用される機会が多くなってくると予想されます。本連載が、これからjQueryを利用される方の有用な資料となれば幸いです。 なお、本連載はリファレンスという性質上、入門レベルからの解説は行っていません。jQueryの基本については、拙稿「ASP.NETプログラマーのためのjQuery入門」も併せて参照することをお勧めします。 それではさっそく始めましょう。まずは、jQueryのキモともいえる「$()関数」で使える、さまざまなセレクタ構文についてまとめていきます。 id値で要素を特定するには? タグ名で要素を特定するに
Multiple File Upload With Progress Bar Using jQuery jQueryで実装する進捗グラフ付き複数ファイルアップローダー。 次のようなマルチファイルアップローダーが実装できるjQuery+PHPなソースが公開されています。 アップロード部分には swfupload を使っているみたい。 サイトではjQueryを使っていて、こういう機能を実装したいという場合に覚えておくと使えるかも。 関連エントリ jQueryでチェックボックスをすごい形にカッコよくしちゃう方法 jQueryでリアルタイムにCSSを書き換えるサンプル jQuery用のGUIコンポーネントプロジェクト「mbideasproject」がすごい ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集
jQueryでチェックボックスをすごい形にカッコよくしちゃう方法が紹介されていました。 具体的なデザインは以下。もうチェックボックスの原型がないという、面白くて分かりやすいUIに調整されています。 マークアップ上も、次のように綺麗になっています。 実際のタグは、不可視にしちゃって、jqueryによって、on/off を切り替えればいいわけですから、まさに何でもありで、参考にして他にも面白く、使いやすいデザインはいくらでも作れるかもしれません。 jQueryによるクロスブラウザ対応が出来るので、昔のように神経質になる必要もないですね。 詳細は以下のエントリから参照。 Pretty checkboxes with jQuery | Aaron Weyenberg
GoogleカレンダーみたいなカレンダーをjQueryで一瞬で作成できる「jquery-week-calendar」 2009年08月05日- jquery-week-calendar - Project Hosting on Google Code GoogleカレンダーみたいなカレンダーをjQueryで一瞬で作成できる「jquery-week-calendar」。 次のような、ドラッグ&ドロップでイベントを作れるGoogle カレンダー風のウィジェットがjQueryプラグインとして公開されました。 なんと、次の1行で初期化という簡単っぷりです。 $("#calendar").weekCalendar(); 当然、コールバックを設定して、イベント追加時のコードをかけたりします。 プロジェクトページのリファレンスも充実しているようで、カスタマイズも簡単でしょう。 関連エントリ とても洗練さ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く