使い方
$.MTAppMsg({
msg: '',
type: 'info',
parent: false,
timeout: 0,
animation: 'fadeOut'
});
オプション設定は下記の通りです。msg は必須です。
オプション
msg(Type : String, Default : '')
表示させたいメッセージの内容を設定します。HTML タグも使えます。
type(Type : String, Default : 'info')
info、success、error のいずれかを設定します。タイプによってメッセージの背景色が違います。初期値は info です。
error を設定した場合は閉じるボタンは表示されません。
type: info の場合
type: success の場合
type: error の場合
parent(Type : Boolean, Default : false)
通常のメッセージ部分の出力ソースコードは次のようになっています。
<div class="msg msg-info">
<p class="msg-text">表示されるメッセージ</p>
<span class="mt-close-msg close-link clickable icon-remove icon16 action-icon">閉じる</span>
</div>
このうち、表示されるメッセージを囲む p 要素を削除し、div.msg 要素に直接 msg オプションの値を出力する場合は、parent オプションに true を設定します。
<div class="msg msg-info">
表示されるメッセージ
<span class="mt-close-msg close-link clickable icon-remove icon16 action-icon">閉じる</span>
</div>
timeout(Type : Number, Default : 0)
0 を超える数値を設定すると、一定時間経過後にメッセージが非表示になります。
単位はミリ秒です(3 秒の場合は 3000)。
animation(Type : String, Default : 'fadeOut')
非表示になる際のアニメーションを指定します。設定できる値は 'fadeOut' または 'slideUp' です。
初期値は 'fadeOut' です。
サンプル
type: info のメッセージを表示させる場合は次のコードを user.js に記述します。
$.MTAppMsg({
msg: '表示させるメッセージinfo',
type: 'info'
});
type: success のコードを 5 秒後にスライドアップアニメーションで非表示にする場合は、次のコードを user.js に記述します。
$.MTAppMsg({
msg: '表示させるメッセージsuccess',
type: 'success',
timeout: 5000,
animation: 'slideUp'
});
また、次のようなコードを user.js に記述すれば、メッセージ部分に YouTube 等の動画を表示させることも可能です。
<mt:SetVarBlock name="msg"><iframe width="560" height="315" src="http://www.youtube.com/embed/ESTFQB6XOmM" frameborder="0" allowfullscreen></iframe></mt:SetVarBlock>
$.MTAppMsg({
msg: '<mt:Var name="msg" encode_js="1">',
type: 'info'
});