陈斌彬的技术博客

Stay foolish,stay hungry

Sweet Alert

A BEAUTIFUL REPLACEMENT FOR JAVASCRIPT’S “ALERT”

WebSite

CODE:

sweetAlert("Oops...", "Something went wrong!", "error");

MORE EXAMPLES

A basic message

swal("Here's a message!")

A title with a text under

swal("Here's a message!", "It's pretty, isn't it?")

A success message!

swal("Good job!", "You clicked the button!", "success")

A warning message, with a function attached to the “Confirm”-button…

swal({   title: "Are you sure?",   text: "Your will not be able to recover this imaginary file!",   type: "warning",   showCancelButton: true,   confirmButtonColor: "#DD6B55",   confirmButtonText: "Yes, delete it!",   closeOnConfirm: false }, function(){   swal("Deleted!", "Your imaginary file has been deleted.", "success"); });

DOWNLOAD & INSTALL

Method 1: Install through bower:

$ bower install sweetalert

Method 2: Download the sweetAlert CSS and JavaScript files.

Download files

1.Initialize the plugin by referencing the necessary files:

<script src="lib/sweet-alert.min.js"></script> 
<link rel="stylesheet" type="text/css" href="lib/sweet-alert.css">

2.Call the sweetAlert-function after the page has loaded

swal({    title: "Error!",   
          text: "Here's my error message!",  
          type: "error",   
          confirmButtonText: "Cool" 
          });