Web開発に携わっている人なら感じたことがあると思いますが、
デフォルトのjavascriptのalertはお世辞にも綺麗なデザインだとは思えません。

「bootstrapのModalをアラートの代わりに。。」 色々と代案はありますが、
jqueryやCSS FrameWorkの依存を気にせずに綺麗なalertが表示出来るライブラリがあります。

SweetAlert
 

 

使い方はシンプルなので、特にハマることもないと思います。

// 画像と同じように表示するコード
swal("Good job!", "You clicked the button!", "success");


アラートだけではなく確認画面に使えたり等、汎用性もあります。
( * bootstapのModal程の自由度はありません )

また、通常のalertと違い、ブラウザによって表示に差がでることもありません。
( AndroidやiOS等のモバイル端末でも綺麗に表示されます )

Sweet Alert デモページ (バージョン 1 )

 

* Sweet Alert バージョン2を使ったデモを追加しました ( * 2017年 10月14 )

既存のalertを表示させている部分でも少しコードを変えるだけで利用可能なので、
Sweet Alertに置き換えてみてはいかがでしょうか。

何より、ブラウザを選ばないところが大きいですね。

 


Socialシェアボタン

スポンサーリンク