jQueryのプラグインを探す時に便利なサイトのまとめ
星の数ほどあるたくさんのjQueryのプラグインから、目的にあったものを探すのはなかなか大変ですよね。そんな時に役立つ便利なサイトをまとめました。 まずは手前ミソで自分がまとめたものから。 これは本当に多大な労力と実際の動作確認もしているので自信をもってオススメできます。 jQueryのプラグイン100選 -2013年総集編 日々チェックしているスクリプトから厳選して一年単位でjQueryのプラグインをカテゴリごとに選出しています。プラグインの半分近くは個別に記事も書いてあります。 jQueryのプラグイン100選 -2012年総集編 jQueryのプラグイン100選 -2011年総集編 jQueryのプラグイン100選 -2010年総集編 jQueryのプラグイン100選 -2009年総集編 jQueryのプラグイン100選 -2008年総集編
これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」:phpspot開発日誌
これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」 2011年07月19日- jQuery EasyUI - help you build your web page easily これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」 Ext.jsばりに美しくてリッチなUIをjQueryでも実現できちゃいます。さらに、使い勝手がjQueryなので誰でも簡単に実装できちゃいます。Extはなんとなく取っ付きにくいと感じたかたも簡単に使えそう。 サイト上のチュートリアルやドキュメントも充実していて分かりやすいです。 リッチなものが作れるのはいいけど使い方が難しかったりメンテナンス大変だと、使う気が少し失せてしまいそうですがこれなら大丈夫かもしれません。 テーマやマルチリンガルにも対応しているらし
HTML+CSS主体のJavaScriptエフェクト！ 簡単で「使える」jQueryテクニック（解説つき）
4月から入社した2011年度新卒社員です。 ハロこんにゃんセヨ がぜんウェブウェブしているほんだです。 今年4月より、意匠部のME課（めか）でマークアップエンジニアとして働いているほんだです。 入社したての新卒社員ですが、PCサイトのHTML+CSSのマークアップや、MovableType（ブログ構築ツール）での組み込みなど、色々な仕事をさせてもらってマークアップリア充です。 そんな中でも最近多い業務はjQueryを使ったビジュアル面でのちょっとしたJavaScript（以下 JS）プログラミングです。 jQueryってとっても便利ですなぁ。HTML+CSSの知識を持っている人なら、簡単に「使える」エフェクトをつくれます。 この記事では僕が入社して2ヶ月間に学んだ、簡単で「使える」jQueryテクニックを紹介します。 jQueryってなんぞってとこと、使う前の準備をざっくり解説 jQuer
少しのjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする
列全体がクリック可能で、Wikipediaに飛びます。セル内にアンカータグが含まれている場合はそちらが優先されます。Webサービスの料金プランなんかに使えそうでは。 jQuery( function($) { $('tbody tr[data-href]').addClass('clickable').click( function() { window.location = $(this).attr('data-href'); }).find('a').hover( function() { $(this).parents('tr').unbind('click'); }, function() { $(this).parents('tr').click( function() { window.location = $(this).attr('data-href'); }); });
jQueryを学ぶためのリンク集
1. 概要の理解 jQueryを一切知らない場合はまずは概要の理解から始めます。 ノンプログラマーのためのjQuery入門 http://www.slideshare.net/hayatomizuno/jquery-7665168 はじめてのjQuery http://higashizm.sakura.ne.jp/jquery_first/ 2. 基本的な使い方を理解する サンプルを見ながら具体的なコードを作成し理解を深めます。 40分で覚えるjQuery速修講座 http://ascii.jp/elem/000/000/498/498710/ jQuery基礎文法最速マスター http://blog.webcreativepark.net/2010/02/02-111519.html jQueryサンプル集 http://www.designwalker.com/2008/04/jque
超かっこいいmarquee2.0を実現するjQueryプラグイン「fMarquee」:phpspot開発日誌
jQuery Marquee Animation Plugin Preview - CodeCanyon 超かっこいいmarquee2.0を実現するjQueryプラグイン「fMarquee」。 ホームページをつくりはじめた時には誰もが使ったマーキー。覚えていくにつれ、ほとんど使われないかわいそうなマーキー。 そんなマーキーもjQueryで超かっこ良く、まるで映画のプロモーション動画に使われるようなエフェクトに生まれ変わったようです。 生まれ変わったマーキーを見てみよう 実装は超簡単！ <script language="javascript"> $(document).ready(function() { $('.marquee').fMarquee({width: 960, height: 100}); // サイズをオプション指定 }); </script> <!-- 内容はdivに入
[JS]リスト要素の一部をアニメーションで表示・非表示させるスクリプト -aPartHide | コリス
長いリストを省スペースに設置するのに便利なリストの一部を非表示にし、隠したアイテムをアニメーションでスライド表示させるjQueryのプラグインを紹介します。 aPartHide デモ [ad#ad-2] 非表示にするアイテムの数は設定が可能で、デモでは七つのアイテムを配置したリスト要素の初期状態では3アイテムだけ表示し、「more」をクリックするとすべてのアイテムが表示されます。 また、全アイテムを表示した状態で、「less」をクリックすると3アイテムのみ表示されます。 aPartHideの実装 HTML リスト要素をdiv要素で内包し、表示・非表示用のdiv要素を配置します。 <div id="box1" class="demo"> <h3>Demo</h3> <ul> <li>Demo list item 1</li> <li>Another list item</li> <li>Th
「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね
Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデート] よくアクセスいただくのでハブ的な役割くらいは果たそうと思います。 jquery / jQueryの本家です。jQuery
最近気になってきたjQueryについて色々調べてみました - もとまか日記
最近、「jQuery」というキーワードをよく見かけます。 これって何だろ？と思ったので調べてみたら、JavaScriptのライブラリのようで。 てことで、最近ちょっと気になってたJQueryについて調べてみました。 jQueryの概要 まずは難しいことは抜きにして、以下を読んでみると分かりやすいです。 はじめてのjQuery jQuery仕様関連 一応ですが、仕様について。 jQuery 日本語リファレンス 必要に応じてみればいいかな？と思ってるので、まだ細かくは見てません。 初心者向けの基礎知識、基礎講座 最初は初心者向けの記事を読んでみると良さそうです。 ASCII.jp：40分で覚える！jQuery速習講座一晩で覚えるjQueryの逆引き基礎サンプル7つjQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみるjQuery 開発者向けメモ サンプル、プラグイン 調べてて
jQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみる
人気のJavaScriptライブラリ、jQueryもかなり 情報が増えました。僕の様に知識が無くても 簡単に動きのあるWebサイトや、更なるユー ザビリティの向上を可能にしてくれましたが、 いつまでもコピペではいずれ困る事になります。 その前にそろそろ基礎から学んでみませんか。 という訳で、jQuery事始め。さほど知識が無い僕が書くのも微妙なんですが、一緒に学んでいきましょう、という事でご了承下さい。内容は基礎中の基礎です。 いつまでもコピペに頼っていては、何か問題が起こったときに対応できませんし、そもそもコピペするならjQueryである必要はありません。 でもjQueryはすごく便利なので、ちゃんと使いこなしたいところですよね。この記事が、誰かが勉強し始める切欠になれば幸いです。 jQueryを使うには まず、jQueryを利用するには本体を読み込む必要があります。方法は2つあって、本
jQuery 日本語リファレンス
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
多数アイテムの絞り込みや並替えを超クールに演出できるjQueryプラグイン「Isotope」:phpspot開発日誌
Isotope 多数アイテムの絞り込みや並替えを超クールに演出できるjQueryプラグイン「Isotope」。 デモページ上部の Filter や Sort、Layout 部分のボタンをクリックすると、下に並ぶ多数のアイテムがそれぞれアニメーションしながら並び替わります。 例えば、iPhone等でページを見ていて、ブログの記事項目が多い場合、フィルタやソートをした方が見やすい場合があったりしそうですが、そんな場合もクリック一発で求める情報に絞り込めて便利。 ただ絞り込むだけではなくアニメーションがクールに演出してくれます。 デフォルトの並び。これだけ見ても綺麗ですが、ボタンクリックでソートすると・・・。 次のようにレイアウトががらりと変わります。 アニメーションがいいです。レイアウトなんかも替えられます。 アイテムを絞りこむと次のようにアイテムが少なくなって見やすくなります。 尚、商用で利
超カッコいい確認ダイアログをjQueryで実装するチュートリアル:phpspot開発日誌
How to Create a jQuery Confirm Dialog Replacement | Tutorialzine 超カッコいい確認ダイアログをjQueryで実装するチュートリアル 普通、ダイアログというと javascript の confirm とか、その他 jquery プラグインを使って実装されるものが多いですが、これまで見たなかでもかなりのカッコよさのダイアログ実装チュートリアルです。 サンプルのダウンロードも可能。 一見全て画像のようにも見えますが、CSS3を使って綺麗にデザインされています。 ここら辺もこだわりたいという方は参考にしてみるとよさそう。 関連エントリ 効果音付きでアニメーションするクールなダイアログ実装jQueryプラグイン「Float Dialog」 その場でポップアップするクールな確認ダイアログ実装用jQueryプラグイン「jConfirmAc
jQuery関連の多数のライブラリが登録されているJSホスティングの「Cached Commons」:phpspot開発日誌
jQuery関連の多数のライブラリが登録されているJSホスティングの「Cached Commons」 2010年09月01日- Cached Commons jQuery関連の多数のライブラリが登録されているJSホスティングの「Cached Commons」。 <script src="****"></script> のようにしてそのまま使えるGitHub上のCDNにのったJSホスティングサービスです。 jQueryのプラグインなどが豊富なのでGoogleなんかに乗っかっていない場合はこちらを使ってみるのもいいかも。 特にアクセスの多いサイトなどではこうしたJSの転送量もばかになりませんから、転送量節約のためにもよさそうです。 尚、欲しいものがあったらリクエストで追加してくれるそうです。 関連エントリ GoogleにホスティングされているjQuery等の便利JSタグを一瞬でコピーできる便利
jQueryプラグインを探す際にだいたい見て回る巡回サイトまとめ
cssやプログラミングjQuery探し 個人的にjQuery関連のブクマ が分かりにくくなってきたので 整理も兼ねてシェア。プラグ インを探す時にだいたい巡回 しているサイトをまとめます。 個人的にjQuery関連のブクマ が分かりにくくなってきたので 整理も兼ねてシェア。プラグ インを探す時にだいたい巡回 しているサイトをまとめます。 かなり情報が多くなってきたjQuery。使いやすいし、知識の無い僕でも簡単に使えるので重宝してます。そんなjQueryですが、多すぎて探すのも大変ですね。以前ご紹介したサイトも兼ねて、ブックマークの整頓がてら、順回しているサイトをご紹介します。 codrops jQueryと言えば個人的にここを思い浮かべます。情報も新しく早い。英語OKならRSS購読推奨です。 codrops css-tricks こちらはWebデザイナー目線で情報を配信しています。有益j
シンプルにヒントを表示するのに最適なjQueryプラグイン:phpspot開発日誌
Pop! simple pop menus with jQuery シンプルにヒントを表示するのに最適なjQueryプラグイン。 なんらかのヒントをちょこっと出したい、でもスペースはとりたくないといった場合に使えそうなポップアップ実装用のjQueryプラグインが公開されています。 ▼クリックで広がってヒントを表示します。 見えるメニュー項目をできるだけ少なくしておき、クリックで表示するようにしておけば、ページの分かりやすさが上がってユーザビリティをあげられそうな局面がありそうですね。 関連エントリ 滑らかにアニメーションして美しいポップアップを作成するチュートリアル LightBox風に角丸で可愛く画像をポップアップしてくれる「Facebox」 同一ページ内でポップアップウィンドウを開くJavascriptライブラリ
これは注目！jQueryでExtばりにリッチなＵＩが実装できる「jQuery Ribbon」:phpspot開発日誌
これは注目！jQueryでExtばりにリッチなＵＩが実装できる「jQuery Ribbon」 2009年05月28日- jQuery Ribbon - Home これは注目！jQueryでExtばりにリッチなＵＩが実装できる「jQuery Ribbon」。 利用すれば、コントロールのグルーピングや、ドロップダウンメニュー、階層リストなどのリッチなコンポーネントが実装できるみたい。 jQuery Ribbonを使ったリッチなＵＩ。Windows7っぽいデザインのＵＩがJavaScriptで。 アイコン付きのかっこいいメニュー 表示しているＵＩのテーマを選べる アイコンつきリスト アイテムのグルーピング ドロップダウンメニュー ちょっとこれは素晴らしいですね・・・。jQueryの優位性がますます高くなってしまいましたね。 関連エントリ ナビゲーションのUIはこれで完璧かもなjQueryプラグイ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://atmarkit.itmedia.co.jp/ait/subtop/features/da/dt_jqueryref_index.html
http://moto-mono.net/2009/07/07/jqueryplugins-i-have-used.html
jQueryでweb制作をする時にキープしておきたい30リストまとめ*ホームページを作る人のネタ帳