注目キーワード

MOONGIFT

OSSを中心としたメディアポータル

JavaScriptを使って、クールなインタフェースを実現するライブラリは幾つか存在する。よく使われるものとしては、画像をクリックするとその場で拡大表示するもの、タブインタフェース、WYSIWYGなHTMLエディタ、レーティング、プログレスバー、コンテクスト(右クリック)メニューなどなど。 0

Picture 219.png
フローティングウィンドウ 0

 

どれも個別のライブラリは存在する。だが、よく使われるものだけに、一つ一つ用意するのが面倒という人もいるはずだ。そこでこれを使おう。 0

今回紹介するオープンソース・ソフトウェアはLivePipe UI、Prototype.jsを使ったモダンなUIを実現するライブラリだ。 0

LivePipe UIが実現する機能はタブ、WSYIWYGエディタ、ツールチップ、フローティングウィンドウ表示、レーティング、プログレスバー、コンテクストメニューなどがメジャーなものとして挙げられている。レーティングはマウスによって動くだけでなく、表示のみにするモードもあるのが便利だ。 0

Picture 222.png
プログレスバー 0

 

もう二つ便利な機能がある。一つは複数選択のドロップダウンだ。これは通常のHTMLでもできるものだが、LivePipe UIを使うとリストにチェックボックスが追加されて、選択するとそれらがカンマつなぎで一行になる。つまり複数選択でないドロップダウンリストと同じ高さで済むのだ。 0

もう一つはスクロールバーだ。長文を表示する際に使えるこれは、クリックで一番下に移動したり、逆に一番上に戻る、50ピクセルだけ動かすといった制御ができる。どれも便利で有効に使える場面が多そうだ。各機能は関数を追加して拡張できるようにもなっている。 0

最近はjQueryを利用する方が多かったが、LivePipe UIを使うようにすればプラグインを探す手間が省けるかも知れない。何ができるのか知っておくと、いざという時に役立つはずだ。 0

 

LivePipe™ : User Interface Components for Prototype
 http://livepipe.net/ 0

MOONGIFTの関連記事

このエントリーを含むTwitter

Related Posts Plugin for WordPress, Blogger...
新規購読
新規購読

プレミアムでしか読めない記事が161あります。ぜひ登録を!

  • オープンブロックス - OpenBlockS
  • 広告募集

ぷらっとオンラインおすすめ商品もっと見る

もっと見る

人気記事もっと見る