Skip to content

hifiveのUIライブラリ紹介「ArrowBox(その1)」

by : 2016/10/25

hifiveが提供している業務システム開発で使えるUIライブラリの紹介です。今回はArrowBoxを紹介します。ArrowBoxは指定したDOMの上下左右、任意の場所に対してツールチップを出すライブラリです。

動作デモはこちらで確認できます。使ってみているところは下の画像を参照してください。

使い方

HTMLはとてもシンプルなものです。ただし、h5arrowboxというIDのDOMを用意しているのが特徴になります。

そして、JavaScriptのコントローラは次のようになります。view.registerが特徴です。

そして、ボタンをクリックした時のイベントを作成します。directionはHTMLのdata要素で指定した、up/downまたはright/leftが指定できます。

さらに吹き出しを消すためのイベントも作成します。

このような実装によって、ツールチップが好きな場所に出せるようになります。


動作デモはこちらで確認できます。ヘルプとしてぜひ使ってみてください。

 

hifive – HTML5企業Webシステムのための開発プラットフォーム

banner_02

From → hifive

コメントは停止中です。

%d人のブロガーが「いいね」をつけました。