かっこいいトースト通知を簡単に設置できるjavascriptライブラリ5選
2019/3/22
シンプルでスタイリッシュな通知
toastr
画面のじゃまにならないサイズだけど、しっかり目にとまるデザイン
どんなサイトでも違和感のないデザイン
ダイアログボックス寄りの表示が多い
SweetAlert2
何かしら確認などのアクションを求めることが多い場合におすすめ
デフォルトでは白ベースなので、サイトのデザインを問わず使いやすい
上か下から幅いっぱいの通知が表示されるタイプ
notie.js
全幅タイプなのでスマホ用にピッタリ、PCだとややスペースを取りすぎかもしれない
デフォルトの色がポップなので、サイトデザインに合わせて色を調整する必要はありそう
やや薄味デザインの通知
notify.js
薄めの色でさり気なく表示されるのでうっかりすると気づかないかもしれませんが、設定は細かくできるので便利です。
他のトースト通知にはない、特定のHTML要素の隣にトーストを出すということもできるので、
画面内の操作の案内をするような場合には最適かもしれません
ブートストラップベースのトースト通知
Bootstrap Notify
デザインがブートストラップそのままなので、サイトがブートストラップでできている場合の親和性は高い。
トーストにリンク先を指定してクリックしたら遷移させたりも可能。