diff --git a/index.js b/index.js
index 3a6448b..a0d75a4 100644
--- a/index.js
+++ b/index.js
@@ -170,7 +170,7 @@ Dialog.prototype.effect = function(type){
  */
 
 Dialog.prototype.modal = function(){
-  this._overlay = overlay();
+  if (!this._overlay) this._overlay = overlay();
   return this;
 };
 
@@ -184,12 +184,7 @@ Dialog.prototype.modal = function(){
 Dialog.prototype.overlay = function(opts){
   var self = this;
   opts = opts || { closable: true };
-  var o = overlay(opts);
-  o.on('hide', function(){
-    self._overlay = null;
-    self.hide();
-  });
-  this._overlay = o;
+  this._overlay = overlay(opts);
   return this;
 };
 
@@ -239,6 +234,9 @@ Dialog.prototype.show = function(){
   // overlay
   if (overlay) {
     overlay.show();
+    overlay.once('hide', function () {
+      self.hide();
+    });
     this._classes.add('modal');
   }
 
@@ -260,8 +258,7 @@ Dialog.prototype.show = function(){
 
 Dialog.prototype.hideOverlay = function(){
   if (!this._overlay) return;
-  this._overlay.remove();
-  this._overlay = null;
+  this._overlay.hide();
 };
 
 /**
@@ -308,6 +305,8 @@ Dialog.prototype.hide = function(ms){
 
   return self;
 };
+
+
 /**
  * Hide the dialog without potential animation.
  *
diff --git a/package.json b/package.json
index 164d627..5e739af 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,9 @@
     "type": "git",
     "url": "git@github.com:component/dialog.git"
   },
+  "scripts": {
+    "build": "browserify -r ./index.js:dialog -d > build/build.js"
+  },
   "license": "MIT",
   "browser": {
     "emitter": "component-emitter",
@@ -32,7 +35,7 @@
     "component-event": "^0.1.0",
     "component-emitter": "^1.1.1",
     "domify": "^1.1.1",
-    "overlay-component": "^0.3.0",
+    "overlay-component": "^0.3.5",
     "component-classes": "^1.1.3",
     "stringify": "^3.1.0"
   },
diff --git a/test/index.html b/test/index.html
index e9e422a..dd33745 100644
--- a/test/index.html
+++ b/test/index.html
@@ -63,11 +63,11 @@
             .on('hide', function(){
               console.log('closed fourth');
 
-              dialog('Click the overlay to close')
+              var overlayDialog = dialog('Click the overlay to close')
               .effect('slide')
               .overlay()
               .show()
-              .on('hide', function(){
+              .once('hide', function(){
                 console.log('closed fifth');
 
                 dialog('Modal')
@@ -93,6 +93,9 @@
                     .show()
                     .on('hide', function(){
                       console.log('closed eight');
+
+                      //test overlay once again (#21)
+                      overlayDialog.show();
                     });
 
                   });