jQueryでフィルタ（フィルタリング）機能をシンプルに実装する方法｜BLACKFLAG
写真の一覧ページなど、Webページ上でたくさん並べられたコンテンツ要素に対して カテゴリ分けした括りなどで、絞り込んだ状態で表示するフィルタ機能。 ページ上に表示する要素が数多くある場合に有効な機能になったりしますが そんなフィルタ機能をjQueryを使ってシンプルに実装するサンプルを作ってみたので紹介してみます。 まずは動作のサンプルから。 下記画面の上部にあるカテゴリリンクをクリックすると そのカテゴリの種類で絞り込まれた状態で画像が表示されます。 フィルタ用のリンクをクリックすることで サイズの縮小とフェードのアニメーションが付いた形で 画像がフィルタリングされます。 このフィルター機能の全体構成について、 まずはHTMLから。 ◆HTML <div id="filter"> <a href="javascript:void(0);" class="allitem">ALL</a>
jQueryを使ったタブメニューの実装サンプルまとめ
**追記** この記事とは直接関係ありませんが、自作のタブプラグインを貼っておきます。 rin316/jquery.tab: jQuery tab plugin. **追記終わり** 仕事でjQueryを使ったタブメニューを作ったので忘れないようにメモ。 それぞれの挙動も比較しやすいように並べてみました。 今日が勉強初投稿の日！ 写真:新川通りで撮った桜。 まずはファイルの用意 下記リンクからダウンロード。 ・jQuery本体…Past Releases内→最新バージョンのMinified ・Download Builder | jQuery UI (このサイトで使っているui.tabs.zip) head内にリンクを張る ダウンロードしたファイルに対して、head内にリンクを張ります。 <head> <!-- jQuery --> <script type="text/javascrip
画像ポップアウト・イメージギャラリー・スライドショー｜jQuery plugin｜Ajax｜PHP & JavaScript Room
Lightweight Circle slideshow〔くるくる回して画像を切り替える円形のイメージギャラリー〕 Smooth Div Scroll〔水平方向に並べた画像をマウス操作でするするスクロール〕 Nivo Slider〔9種類のエフェクトがかけられるイメージスライダー〕 Galleriffic〔画像ギャラリーをリッチかつ高速にレンダリング〕 IMGPREVIEW〔マウスオーバーでリンク先の画像をプレビュー表示〕 jQuery largePhotoBox plugin〔大きな画像対応ポップアップ（マウス移動で画像全体を閲覧可能）〕 PIROBOX〔シンプルかっこいい画像ポップアップ〕 bxGallery〔シンプルな画像ギャラリー〕 A Simple jQuery Slideshow〔シンプルなスライドショー〕 Accessible News Slider〔全件表示や件数に応じて前
ページめくりを実装するjQueryプラグイン「jPageFlipper 」
ページめくりを実装するjQueryプラグイン「jPageFlipper 」 Check Tweet 配布元：jPageFlipper ライセンス：MIT License 「jPageFlipper 」は画像のページめくりを実装する為のjQueryプラグインです。 HTML 5 canvasで開発されておりGoogle Chrome 4以上, Firefox 3.5以上, Safari 4以上, Opera とiPhone、 IPadなどで動作可能です。 利用方法 まずは、ｊＱｕｅｒｙ本体とjquery-vsdoc.js、jquery.pageFlipper.jsをhead要素などで読み込みます。 <script type="text/javascript" src="lib/jquery-1.4.2.min.js"></script> <script type="text/javascri
How to Create an App from Scratch | AppMaster
Turning an app idea into a working reality is a more complicated task than most people might believe. However, with the wealth of software resources available on the internet, creating an app out of your idea is manageable. You don't even need to necessarily know how to develop mobile apps to make your application work. You can hire third parties or freelancers as there many places where you can f
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript + Ajax 実践サンプル集 - ホーム
jQuery custom scrollbar
