fnc c0004 createCss2Button

createCss2Button

概要

• 座標、サイズ、フォントなどを設定したボタンを作成する。
• 従来の関数createCssButtonで使用できる属性値に加え、CSSに対応した属性名に対応する設定が行える。

引数（括弧内はデフォルト値）

引数	型	必須	指定内容
_id	string	*	ボタンのID名
_text	string	*	表示する文字列
_func	function	*	ボタンを押したときの処理
_obj	object		x: X座標(0), y: Y座標(g_sHeight - 100), w: 幅(g_sWidth / 3), h: 高さ(50), siz: フォントサイズ(28), align: 文字位置(中央寄せ), title: オンマウス時の説明表示文, cxtFunc: 右クリック時に実行する関数, (属性名): (属性に対する設定)
_classes	...any		CSSクラス名　※複数指定可

返却値

• この関数で作成したボタン（div要素）

使用例

• _obj内の要素については未指定の場合、デフォルトの値が適用される。

divRoot.appendChild(
    createCss2Button(`btnKeyConfig`, `KeyConfig`, _ => {
        // ボタン処理エリア
        g_kcType = `Main`;
        clearWindow();
        keyConfigInit();
    }, {
        // CSSデザイン系変更エリア
        x: g_sWidth / 3,
    }, g_cssObj.button_Setting)   // CSSクラス
);

spriteList.scroll.appendChild(
    createCss2Button(`btnReverse`, `Reverse:${g_stateObj.reverse}`, evt => {
        setReverse(evt.target);
    }, {
        x: 160, y: 0,
        w: 90, h: 21, siz: C_SIZ_DIFSELECTOR,
        borderStyle: `solid`,
        cxtFunc: evt => setReverse(evt.target),
    }, g_cssObj.button_Default, g_cssObj[`button_Rev${g_stateObj.reverse}`])
);