ポップアップ

タイトルバーとコンテンツエリアを持つウィンドウを画面に表示する部品です

サンプルはこちら

使用方法

srcフォルダにある、以下のファイルが必要です。使用するページで読み込んでください。
- popup.js
- popup.css
src/img/close-icon.pngは×ボタンの表示に必要になります(配置のみ必要です)
h5.ui.popupManager.createPopupでポップアップを作成、返り値のインスタンスが持つshowメソッドでポップアップを表示します
```
					h5.ui.popupManager.createPopup('sample', 'タイトル', '内容').show();
				
```

プロパティとメソッド

h5.ui.popupManagerには以下のメソッドが公開されています

createPopup(group, title, contents, controller, param) ：ポップアップを生成します。引数として以下を指定できます

名前

型

説明

必須

group

String

グループを指定します。同じグループに属するポップアップは一つしか開けません

○

title

String

ポップアップのタイトルを指定します

contents

String | html | jQuery

ポップアップの内容を指定します

controller

Controller

ポップアップのコンテンツエリアにバインドするコントローラを指定します

param

Object

以下のパラメータを指定します

名前	型	説明	デフォルト値
position	String	ポップアップに適用するpositionスタイル	absolute
header	boolean	タイトル領域を表示するか	true
draggable	boolean	ポップアップを移動できるようにするか	false

getPopup(group)：指定したグループのポップアップのインスタンスを取得します

名前型説明必須

group String グループを指定します。 ○

ポップアップインスタンスは以下のメソッドを持ちます

名前	型	説明	引数
名前	型	説明	名前	型	説明	デフォルト値
show		ポップアップを表示します	option.overlay	boolean	オーバーレイを表示するか	true
hide		ポップアップを非表示にします
close		ポップアップを削除します。削除するとポップアップからpopupClosedイベントが発生します	args	Object	popupClosedイベントで渡される引数オブジェクトです
getSize	Object	ポップアップの高さ(height)と幅(width)を持ったオブジェクトを返します
setTitle		タイトルを指定します	title	String	表示するタイトル
getTitle	String	タイトルを取得します
setContentsSize		コンテンツエリアのサイズを指定します	width	number	幅
setContentsSize		コンテンツエリアのサイズを指定します	height	number	高さ
getContentsSize	Object	コンテンツエリアの高さ(height)と幅(width)を持ったオブジェクトを返します
setContents		コンテンツを指定します	contents	String \| DOM \| jQuery	表示するコンテンツ
setContents		コンテンツを指定します	controller	Controller	コンテンツエリアにバインドするコントローラ
getContents	jQuery	コンテンツを取得します
setPosition		ポップアップの位置を取得します	constraint	String	表示位置を文字列で指定します。指定できる文字列は、top/mid/bottomおよびleft/center/rightです。top-leftのような指定も可能です
setPosition		ポップアップの位置を取得します	position	Object	top, leftを数値で指定すると、画面全体からそれだけ移動した位置にポップアップを表示する