マインドマップを描画「js-mindmap」
当ページのリンクには広告が含まれています。
スポンサーリンク
マインドマップが描画できるjQueryプラグイン「js-mindmap」を紹介します。
jQueryプラグイン「js-mindmap」
jQueryプラグイン「js-mindmap」は、ul、liタグで言葉をつなぐだけで簡単にマインドマップが作成できる便利なプラグインです。
スポンサーリンク
便利?というか!!かっこいいので、デモを触ってみてください。
デモのソース(HTML + jQuery)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="description" content="js-mindmap のデモでーす。"> <title>js-mindmap - jQuery Plugin Demo</title> <link href="style.css" type="text/css" rel="stylesheet"/> <link href="js-mindmap.css" type="text/css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.min.js"></script> <script type="text/javascript" src="raphael-min.js"></script> <script type="text/javascript" src="js-mindmap.js"></script> <script type="text/javascript" src="script.js"></script> </head> <body> <h1>js-mindmapのデモでーす。</h1> <ul> <li><a href="#">アルファベット</a> <ul> <li><a href="#">A</a></li> <li><a href="#">B</a></li> <li><a href="#">C</a></li> <li><a href="#">D</a></li> <li><a href="#">E</a></li> </ul> </li> </ul> </body> </html>
スポンサーリンク