■ 最も基本となるサンプルからはじめます。
■ 作成されたメッセージはすべて毎回表示されます。
■ ユーザーは確認後に[×]をクリックすることで非表示にできます。
(メッセージは一度非表示にすると、更新しない限り表示されません。)
■ サンプルです。

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="UIメッセージ-1-step-9" height="150" scrolling="false">
<Locale lang="ja" country="jp"/>
<Require feature="minimessage"/>
// <Require feature="minimessage"/> を <ModulePrefs>の下におきます。
</ModulePrefs>
<Content type="html">
<![CDATA[
<div style="text-align:left;font-size:13px;">
【メッセージ-1】
<p />
* DOMを利用したメッセージの基本形です。
<br />
* ポイントすると背景色が変わります。
</div>
<div id="messageBox"></div>
<script type="text/javascript">
var msg = new gadgets.MiniMessage(__MODULE_ID__); //MiniMessage オブジェクトをインスタンス化
var div = document.createElement("div");
div.innerHTML = "[x] をクリックするとメッセージは閉じます。"; //メッセージの内容
div.onmouseover = function() { //DOMを利用して背景色を変えるonmouseover
div.style.backgroundColor = "yellow";
};
div.onmouseout = function() {
div.style.backgroundColor = "";
};
msg.createDismissibleMessage(div); //メッセージを作成
</script>
<p align="right" />
<a href="http://www5d.biglobe.ne.jp/~pog/" alt="Googleを追いかけろ!" title="Googleを追いかけろ!" target="_blank"><img src="http://www5d.biglobe.ne.jp/~pog/img/gapps.png" border="0"></a>
]]>
</Content>
</Module>
■ 編集用リンク