diff --git a/AlertAsset.php b/AlertAsset.php
new file mode 100644
index 0000000..657cf83
--- /dev/null
+++ b/AlertAsset.php
@@ -0,0 +1,26 @@
+<?php
+/**
+ * @link http://www.yiiframework.com/
+ * @copyright Copyright (c) 2008 Yii Software LLC
+ * @license http://www.yiiframework.com/license/
+ */
+
+namespace stronglab\alert;
+
+use yii\web\AssetBundle;
+
+class AlertAsset extends AssetBundle
+{
+    public $sourcePath = '@stronglab/alert/web';
+    public $css = [
+        'alert.css',
+    ];
+    public $js = [
+        'alert.js',
+    ];
+
+    public $depends = [
+        'yii\web\JqueryAsset',
+        'yii\bootstrap\BootstrapAsset',
+    ];
+}
diff --git a/FlashMessage.php b/FlashMessage.php
index e29adc2..20624ca 100644
--- a/FlashMessage.php
+++ b/FlashMessage.php
@@ -4,8 +4,12 @@
 
 class FlashMessage extends \yii\base\Widget
 {
-    public function run()
+    public function init()
     {
-
+        $view = $this->getView();
+        AlertAsset::register($view);
+        if (Yii::$app->session->getAllFlashes()) {
+            $this->registerJs('showMessage("' . implode('<br/>', Yii::$app->session->getAllFlashes()) . '")');
+        }
     }
 }
diff --git a/README.md b/README.md
index a57682a..e2b6991 100644
--- a/README.md
+++ b/README.md
@@ -28,4 +28,5 @@ Usage
 Once the extension is installed, simply use it in your code by  :
 
 ```php
-<?= \stronglab\alert\FlashMessage::widget(); ?>```
\ No newline at end of file
+<?= \stronglab\alert\FlashMessage::widget(); ?>
+```
\ No newline at end of file
diff --git a/composer.json b/composer.json
index b0d2aaa..6b03d73 100644
--- a/composer.json
+++ b/composer.json
@@ -1,21 +1,25 @@
 {
-    "name": "stronglab/yii2-alert",
-    "description": "Yii2 Alert Message",
-    "type": "yii2-extension",
-    "keywords": ["yii2","extension"],
-    "license": "BSD-3-Clause",
-    "authors": [
-        {
-            "name": "strong",
-            "email": "strong.barnaul@gmail.com"
-        }
-    ],
-    "require": {
-        "yiisoft/yii2": "*"
-    },
-    "autoload": {
-        "psr-4": {
-            "stronglab\\alert\\": ""
-        }
+  "name": "stronglab/yii2-alert",
+  "description": "Yii2 Alert Message",
+  "type": "yii2-extension",
+  "keywords": [
+    "yii2",
+    "extension"
+  ],
+  "license": "BSD-3-Clause",
+  "authors": [
+    {
+      "name": "strong",
+      "email": "strong.barnaul@gmail.com"
     }
+  ],
+  "require": {
+    "yiisoft/yii2": "*",
+    "yiisoft/yii2-bootstrap": "*"
+  },
+  "autoload": {
+    "psr-4": {
+      "stronglab\\alert\\": ""
+    }
+  }
 }
diff --git a/web/alert.css b/web/alert.css
new file mode 100644
index 0000000..2de256a
--- /dev/null
+++ b/web/alert.css
@@ -0,0 +1,13 @@
+.flash-modal {
+    position: fixed;
+    top: 20px;
+    right: 30px;
+    z-index: 9999;
+    display: none;
+    width: 350px;
+    padding: 30px;
+    text-align: center;
+    border-radius: 4px;
+    border: 1px #9acfea solid;
+    font-size: 1.1em;
+}
\ No newline at end of file
diff --git a/web/alert.js b/web/alert.js
new file mode 100644
index 0000000..2eceb82
--- /dev/null
+++ b/web/alert.js
@@ -0,0 +1,33 @@
+$(".flash-modal").bind("contextmenu", function (e) {
+    e.preventDefault();
+    $(this).fadeOut(420);
+});
+
+function showMessage(message, fade, type) {
+    fade = typeof fade !== "undefined" ? fade : 1;
+    type = typeof type !== "undefined" ? type : "alert-info";
+    var obj = $(".flash-modal");
+    obj.html("<b>" + message + "</b>");
+    obj.addClass(type);
+    obj.stop().animate({opacity: "100"});
+    obj.show();
+    if (fade) {
+        messageBoxFadeOut();
+        obj.mouseover(
+            function () {
+                if ($(this).is(":animated")) {
+                    $(this).stop().animate({opacity: "100"});
+                }
+            }
+        );
+        obj.mouseleave(messageBoxFadeOut);
+
+    }
+}
+
+function messageBoxFadeOut() {
+    var obj = $(".flash-modal");
+    obj.fadeOut(7000, function () {
+        obj.removeClass("alert-danger alert-success alert-info");
+    });
+}
\ No newline at end of file