こういうライブラリは利用場面が多そうです。 Webサイトを見ているユーザに通知を出したいと思うことは良くあります。例としてはエラー通知があります。Ajaxで発生したエラーを通知する場所をどこにするかは考えものです。場合によってはユーザはその場所を表示していないかもしれないからです。 そこで使ってみたいのがフローティングで表示するタイプの通知です。ウィンドウに対する相対位置で指定されるので必ずユーザが見ている画面上に出せるのが利点です。そんな通知を表示するライブラリ、notifItを紹介します。

notifItの使い方

最もシンプルな例です。

notif({
  msg: "<b>Success:</b> In 5 seconds i'll be gone",
  type: "success"
});

とすると表示は次のようになります。

デフォルトは右上、5秒で消えます。

notif({
  msg: "<b>Oops!</b> A wild error appeared!",
  type: "error",
  position: "center"
});

positionで表示場所が指定できます。

中央に赤く（エラー指定なので）通知が出ます。

notif({
  type: "warning",
  msg: "<b>Warning:</b> Be patient my friend.",
  position: "left"
});

この場合は左上、ウォーニング表示になります。

小さなボックスの他、幅いっぱいにバナーとして表示もできます。

透明度の指定も可能です。

使い方が良いですね。アニメーションしながら表示され、HTMLが使えたり細かくカスタマイズもできますので色々と応用ができそうです。Webサイトを訪問している人に通知を出したり、気付きづらいエラー表示を分かりやすくしたりするのに使えそうです。 notifItはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。 naoxink.hol.es/notifIt/ naoxink/notifIt