右上にぽこっと出てくるあれ。ちょっとした機能だけど実装するとかっこいい。
1, まずはココ←から「pnotify」をダウンロード
2, 以下の通り必要なファイルを読み込む。head内が無難かと。
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.pnotify.js"></script>
<link href="jquery.pnotify.default.css" media="all" rel="stylesheet" type="text/css" />
<link href="jquery.pnotify.default.icons.css" media="all" rel="stylesheet" type="text/css" />
// ※公式と同様のスタイルにするためにはbootstrap.cssを読み込む必要があるので注意
3, Growlウィンドウを出したいタイミングで下記コードを呼び出す
$.pnotify({
title: 'Success Title',
text: 'Test Message',
type: 'success'
});
デモ←クリック(右上に表示されます。)
※bootstrap.cssを読み込んでいないため、全く装飾されていないウィンドウが表示されます。
ほかにも色々な出し方があるので、詳しくは公式サイトを参照されたし。↓
http://sciactive.github.io/pnotify/