リストをインクリメント検索・ソートできる「List.js」

List.jsは、リストをインクリメント検索やソートができるjQueryプラグインです。
ダウンロードはこちら
リストだけでなくテーブルにも実装可能のようです。

スクリプト

<script src="jquery.min.js" type="text/javascript"></script>
<script src="list.min.js" type="text/javascript"></script>

実装

<div id="div1065">
    <input class="search" />
    <!-- featureクラスでソート -->
    <span class="sort" data-sort="feature">Sort features</span>
    <ul class="list">
        <li>
            <h4 class="feature">Search</h4>
            <small class="description">Search through all items.</small>
        </li>
        <li>
            <h4 class="feature">Sort</h4>
            <small class="description">Sort lists by value that
                you choose.</small>
        </li>
        <li>
            <h4 class="feature">Filter</h4>
            <small class="description">Write your own filter functions.</small>
        </li>
        <li>
            <h4 class="feature">Add</h4>
            <small class="description">Add items on the fly.</small>
        </li>
        <li>
            <h4 class="feature">Get</h4>
            <small class="description">Get item based on value.</small>
        </li>
        <li>
            <h4 class="feature">Update</h4>
            <small class="description">Update items as you go.</small>
        </li>
        <li>
            <h4 class="feature">Remove</h4>
            <small class="description">Remove items whenever you feel like.</small>
        </li>
    </ul>
</div>

リスト内にclassを指定することで、ソート機能の範囲などを細かく指定できます。
そして、valueNamesに各クラスを登録します。

var options = {
    valueNames: [ 'feature', 'description' ],
};

var featureList = new List( 'div1065', options);

デモ

こちら

オプション

: タブを画面サイズによってアコーディオンにしてくれる「Easy Responsive Tabs to Accordion」

「Easy Responsive Tabs to Accordion」はタブ表示を画面サイズによって折りたたみのアコーディオン形式に変換してくれるjQueryプラグインです。デフォルトでは、768

: selectボックスを華麗にしてくれる「Chosen」「Select2」

selectボックスに当てるjQueryプラグインを色々探してみましたがこれに決めました。シングルやマルチ、またグループにも対応しています。インスタンス検索してくれるのが決め手 Chosen CDN

: 要素を折りたたみできる「nestedAccordion」

「nestedAccordion」は、クリックすると要素を開閉(折りたたみ)できるjQueryプラグインです。名前の通りネストして、アコーディオンの中にアコーディオンも実装できます。ダウンロードはこち

: iTunesのCover Flowのようなギャラリーが実装できる「ContentFlow」

「ContentFlow」は、iTunesのCover Flowのように左右に流れるギャラリーが実装できるjQueryプラグインです。ダウンロードスクリプト実装

: カレンダー実装プラグイン「Bootstrap Calendar」

「Bootstrap Calendar」はBootstrap 3ベースでカレンダーが実装できるjQueryプラグインです。ダウンロードスクリプト

: レスポンシブに対応した画像ギャラリーが実装できる「Responsive Image Gallery」

「Responsive Image Gallery with Thumbnail Carousel」はレスポンシブにも対応した画像ギャラリーが実装できるjQueryプラグインです。Twitterの「最