# jQuery MSG Plugin Demo

### Default usage

Click me

              $.msg();

### Custom content

Click me

              $.msg({ content : 'blah blah' });

### Disable auto unblock

Click me

              $.msg({ autoUnblock : false });

### Custom speed

Click me

              $.msg({
                fadeIn : 500,
                fadeOut : 200,
                timeOut : 5000
              });

### Switch theme

Click me

              $.msg({ klass : 'white-on-black' });

### Custom theme

Click me

              $.msg({ klass : 'custom-theme' });

### Replace content, events and manually unblock

Click to delete the user
Restore user

I am the user

              // block the screen to show msg when click on #replace-content btn
              $( '#replace-content' ).bind( 'click', function(){
                $.msg({
                  autoUnblock : false,
                  clickUnblock : false,
                  content: '<p>Delete this user?</p>' +
                           '<p class="btn-wrap">' +
                             '<span id="yes">Yes</span>' +
                             '<span id="no">no</span>' +
                           '</p>',
                  afterBlock : function(){
                    // store 'this' for other scope to use
                    var self = this;

                    // delete user and auto unblock the screen after 1 second
                    // when click #yes btn
                    $( '#yes' ).bind( 'click', function(){

                      // self.method is not chainable
                      self.replace( 'User deleted.' );
                      self.unblock( 2000 );
                      // this equals to
                      // $.msg( 'replace', 'User deleted.' ).
                      //   msg( 'unblock', 2000 );

                      $( '#the-user' ).empty();
                    });

                    $( '#no' ).bind( 'click', function(){

                      // this equals to $.msg( 'unblock' );
                      self.unblock();
                    });
                  },
                  beforeUnblock : function(){
                    alert( 'This is a callback from beforeUnblock event handler :)' )
                  }
                });
              });

### Demo provides by DreamersLab