グリッドレイアウト採用時に便利なjQueryプラグイン 20 - NxWorld
有名なサイトだとPinterestやBehanceなどで取り入れているような、グリッドレイアウトを簡単に実装できるjQueryプラグインのまとめです。 少し前はポートフォリオのギャラリー部分などのような箇所で主に使われている印象が個人的にあったのですが、最近ではブログの記事一覧やECサイトなどでもよく見かけますし、コーポレートサイトのトップに採用しているサイトなども多く見かけます。 基本的な動きは同じようなものでもサポートブラウザやアニメーションの有無などがプラグインによって違うので、自分の中で幾つか使いやすいものを見つけておくと良いと思います。 一応グリッドレイアウトを実装するためのプラグインということでまとめていますが、中にはフィルタリング・ソート・ドラッグ&ドロップなどの機能も併せて実装できるプラグインもあります。 また、基本的にフリーで使用できるもの中心でまとめていますが、商用利用
jQueryのプラグインを探す時に便利なサイトのまとめ
星の数ほどあるたくさんのjQueryのプラグインから、目的にあったものを探すのはなかなか大変ですよね。そんな時に役立つ便利なサイトをまとめました。 まずは手前ミソで自分がまとめたものから。 これは本当に多大な労力と実際の動作確認もしているので自信をもってオススメできます。 jQueryのプラグイン100選 -2013年総集編 日々チェックしているスクリプトから厳選して一年単位でjQueryのプラグインをカテゴリごとに選出しています。プラグインの半分近くは個別に記事も書いてあります。 jQueryのプラグイン100選 -2012年総集編 jQueryのプラグイン100選 -2011年総集編 jQueryのプラグイン100選 -2010年総集編 jQueryのプラグイン100選 -2009年総集編 jQueryのプラグイン100選 -2008年総集編
jQueryで使えるけどCSSでは使えないセレクター。（CSS おれおれ Advent Calendar 2012 – 13日目） | Ginpen.com
CSS おれおれ Advent Calendar 2012 – 13日目 今日はちょいと視点を変えて見ました。 jQueryの特徴的な機能として「CSSのセレクターを使って要素を検索できる」というのがあります。 ただしjQueryでは独自に拡張してCSS本来のセレクターよりも強力だったりします。逆にjQueryを普段から使っていてたまにCSSを書こうとすると迷う場面もありそうです。 というわけで、jQueryが独自に拡張しているセレクター一覧です。（属性非同値セレクター以外は全部疑似セレクターですね。） 全般 [name!="value"] Attribute Not Equal Selector [name!=”value”] – jQuery API 属性が指定の値でないものを検索します。 .not('[name="value"]')の方が高速です。 意外とこれCSSにないんですよね。
並び替え、アニメーションも対応したグリッドライブラリ·jQuery.Shapeshift MOONGIFT
jQuery.Shapeshiftは自分でドラッグ&ドロップできるグリッドライブラリです。 最近増えたのがPinterestのように高さの異なるボックスを並べて表示するUIです。そしてさらに自分で並び替えまでできるようにしたのがjQuery.Shapeshiftです。 最初の表示です。 ドラッグして移動できます。その時、ちょっと斜めの表示になるのがいい感じです。 全てを猫に！ jQuery.Shapeshiftではオプションが色々あり、ドラッグ時のアニメーション可否やそもそもドラッグ可否も指定できます。たとえ同じコンテンツであっても見せ方を工夫することでユーザ体験は全く違ったものになります。さらにユーザ自身による並び替えがあればカスタマイズ性が大きく向上するでしょう。 jQuery.ShapeshiftはjQuery/JavaScript製のソフトウェア（ソースコードは公開されていますがラ
blockquote要素単体から引用元を視覚化する
Updated 2010.08.22 / Published 2010.08.22 blockquote要素単体から引用元を視覚化できるように、引用元へのリンク、及び引用元を示すテキストを生成するためのスクリプトです（jQuery使用）。引用元が書籍でISBNコードが示されている場合は、Amazonのリンク（アソシエイトID付き）へと変換します。 @ub_pnrさんがjQueryプラグイン版を公開されました。「jQuery.prettyQuote.js」おすすめです！ 諸背景と実現したいこと UAが処理するにあたっては、blockquoteやq要素のcite属性に引用元のURI（リソースの所在や名前）と、title属性に引用元の説明情報があれば、適切に解釈されることになっていようとは思うのですが、残念ながら主要な視覚環境のUAにおいてcite属性、title属性で示された情報が視覚的に表さ
iPhone風のあのスクロールをPCでも実現できる「jQuery.flickable」:phpspot開発日誌
jQuery.flickable - Demo iPhone風のあのスクロールをPCでも実現できる「jQuery.flickable」 スクロールしすぎると元に戻るスマホのスクロールをPCのブラウザで実現できます。 ドラッグ＆ドロップしてタッチ操作っぽくスクロールすることも可能で、素早く操作すればその分素早く移動したり、スマホでの動作そっくり。スマホでもそのまんま動くという優れもの スライダーっぽいものも作れて、iPhoneのホーム画面っぽいものも作れます 国産というところもいいですね。 これがOS標準で搭載されたらいいのにってぐらいによいライブラリでした。 関連エントリ スクロールしてもposition:fixedでウザくない感じのナビゲーション実装ライブラリ「stickyMojo」 ページ内スクロールならコレにおまかせ！なjQueryプラグイン「Page Scroller」 使うときだ
liteAccordion - a horizontal accordion plugin for jQuery
Demo Suite Test the options for the liteAccordion plugin by changing the options below. Hit enter to see changes when entering a custom value, and use reset to start again. Toggle the output view to get the code for your custom settings object. theme easing containerWidth containerHeight headerWidth activateOn firstSlide slideSpeed autoPlay pauseOnHover cycleSpeed rounded enumerateSlides linkabl
jQuery
Lightweight Footprint Only 30kB minified and gzipped. Can also be included as an AMD module CSS3 Compliant Supports CSS3 selectors to find elements as well as in style property manipulation What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
