開閉できるツリー構造を表現できる「jsTree」

「jsTree」は、Webサイト上にツリー構造を表示してくれるJQueryラグインです。実際、使うかというのは謎ですが、ブログ内に設置する機会があり使用してみましたので参考まで。
ダウンロードはこちら

2014.5.28 バージョン3.0.0用に書き換え

インプットデータはXMLやJSONに対応、HTMLを直書きしても開閉などをしてくれるようです。今回は、JSONでやってみました。JSONデータとデモ

スクリプト

<link href="dist/themes/default/style.min.css" type="text/css" rel="stylesheet">
<script src="jquery.min.js" type="text/javascript"></script>
<script src="dist/jstree.min.js" type="text/javascript"></script>

JSONデータの表示

<div id="div795"></div>

<script type="text/javascript">
$(function () {
    $("#div795").jstree({ 'core' : {
        "data": jsonData795
    }});
});
</script>

オプションはかなり豊富です。

サイトより
Currently supported browsers are:
Internet Explorer 6+ *
Mozilla Firefox 2+
Safari 3+
Opera 9+
Google Chrome

その他
Fancytree (Dynatree)
JqTree
a11yTree

: Lightboxなどが実装できるプラグイン「Magnific Popup」

「Magnific Popup」はlightboxを実装できるjQueryプラグインです。この手のものは、商用利用に制限がかかっているものが多いですがこのプラグインはMITライセンスで提供されてい

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

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

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

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

: 画像をモザイク処理(ピクセル化)してくれるプラグイン「Pixelate.js」

「Pixelate.js」はその名の通り画像をピクセル化してくれるjQueryプラグインです。画面ロード時にピクセル化しておき、画像にマウスオーバーすると暴露してくれます。ダウンロード | デモ

: クレジットカード番号のバリデーションとカード会社を特定してくれる「jQuery Credit Card Validator」

「jQuery Credit Card Validator」は、クレジットカード番号のバリデーションを行ってくれるjQueryプラグインです。入力したカード番号の検証とそれに基づいてカード会社の表示を