diff --git a/4chan_x.user.js b/4chan_x.user.js
index 78df3b7f1..6faefe016 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -170,8 +170,8 @@
   })(null, config);
   ui = {
     dialog: function(id, position, html) {
-      var el, left, top, _ref, _ref2, _ref3, _ref4;
-      el = document.createElement('div');
+      var el, left, top, _ref, _ref2;
+      el = d.createElement('div');
       el.className = 'reply dialog';
       el.innerHTML = html;
       el.id = id;
@@ -181,84 +181,73 @@
       if (left) {
         el.style.left = left;
       } else {
-        el.style.right = '0px';
+        el.style.right = 0;
       }
       if (top) {
         el.style.top = top;
       } else {
-        el.style.bottom = '0px';
-      }
-      if ((_ref3 = el.querySelector('div.move')) != null) {
-        _ref3.addEventListener('mousedown', ui.dragstart, false);
-      }
-      if ((_ref4 = el.querySelector('div.move a[name=close]')) != null) {
-        _ref4.addEventListener('click', (function() {
-          return el.parentNode.removeChild(el);
-        }), false);
+        el.style.bottom = 0;
       }
+      el.querySelector('div.move').addEventListener('mousedown', ui.dragstart, false);
       return el;
     },
     dragstart: function(e) {
-      var d, el, rect;
+      var el, rect;
       e.preventDefault();
       ui.el = el = this.parentNode;
-      d = document;
       d.addEventListener('mousemove', ui.drag, false);
       d.addEventListener('mouseup', ui.dragend, false);
       rect = el.getBoundingClientRect();
       ui.dx = e.clientX - rect.left;
       ui.dy = e.clientY - rect.top;
-      ui.width = document.body.clientWidth - el.offsetWidth;
-      return ui.height = document.body.clientHeight - el.offsetHeight;
+      ui.width = d.body.clientWidth - el.offsetWidth;
+      return ui.height = d.body.clientHeight - el.offsetHeight;
     },
     drag: function(e) {
       var bottom, el, left, right, top;
-      e.preventDefault();
       el = ui.el;
       left = e.clientX - ui.dx;
       if (left < 10) {
-        left = '0px';
+        left = '0';
       } else if (ui.width - left < 10) {
-        left = '';
+        left = null;
       }
-      right = left ? '' : '0px';
-      el.style.left = left;
-      el.style.right = right;
+      right = left ? null : 0;
       top = e.clientY - ui.dy;
       if (top < 10) {
-        top = '0px';
+        top = '0';
       } else if (ui.height - top < 10) {
-        top = '';
+        top = null;
       }
-      bottom = top ? '' : '0px';
+      bottom = top ? null : 0;
       el.style.top = top;
-      return el.style.bottom = bottom;
+      el.style.right = right;
+      el.style.bottom = bottom;
+      return el.style.left = left;
     },
     dragend: function() {
-      var d, el, id;
+      var el, id;
       el = ui.el;
       id = el.id;
       localStorage["" + id + "Left"] = el.style.left;
       localStorage["" + id + "Top"] = el.style.top;
-      d = document;
       d.removeEventListener('mousemove', ui.drag, false);
       return d.removeEventListener('mouseup', ui.dragend, false);
     },
     hover: function(e) {
-      var bot, clientHeight, clientWidth, clientX, clientY, el, height, top, _ref;
+      var clientHeight, clientWidth, clientX, clientY, el, height, top, _ref;
       clientX = e.clientX, clientY = e.clientY;
       el = ui.el;
       _ref = d.body, clientHeight = _ref.clientHeight, clientWidth = _ref.clientWidth;
       height = el.offsetHeight;
       top = clientY - 120;
-      bot = top + height;
-      el.style.top = clientHeight < height || top < 0 ? '0px' : bot > clientHeight ? clientHeight - height + 'px' : top + 'px';
+      el.style.top = clientHeight < height || top < 0 ? 0 : top + height > clientHeight ? clientHeight - height : top;
       if (clientX < clientWidth - 400) {
-        el.style.left = clientX + 45 + 'px';
-        return el.style.right = '';
+        el.style.left = clientX + 45;
+        return el.style.right = null;
       } else {
-        el.style.left = '';
-        return el.style.right = clientWidth - clientX + 45 + 'px';
+        el.style.left = null;
+        return el.style.right = clientWidth - clientX + 45;
       }
     },
     hoverend: function(e) {
@@ -1381,6 +1370,9 @@
       $.bind($('input[name=name]', dialog), 'mousedown', function(e) {
         return e.stopPropagation();
       });
+      $.bind($('a[name=close]', dialog), 'click', function() {
+        return $.rm(dialog);
+      });
       $.bind($('#autohide', dialog), 'click', qr.cb.autohide);
       $.bind($('img', dialog), 'click', Recaptcha.reload);
       if ($('.postarea label')) {
diff --git a/script.coffee b/script.coffee
index f5c9963dc..ea4a74873 100644
--- a/script.coffee
+++ b/script.coffee
@@ -98,24 +98,21 @@ _config = {}
 
 ui =
   dialog: (id, position, html) ->
-    el = document.createElement 'div'
+    el = d.createElement 'div'
     el.className = 'reply dialog'
     el.innerHTML = html
     el.id = id
     {left, top} = position
     left = localStorage["#{id}Left"] ? left
     top  = localStorage["#{id}Top"]  ? top
-    if left then el.style.left = left else el.style.right  = '0px'
-    if top  then el.style.top  = top  else el.style.bottom = '0px'
-    el.querySelector('div.move')?.addEventListener 'mousedown', ui.dragstart, false
-    el.querySelector('div.move a[name=close]')?.addEventListener 'click',
-      (-> el.parentNode.removeChild(el)), false
+    if left then el.style.left = left else el.style.right  = 0
+    if top  then el.style.top  = top  else el.style.bottom = 0
+    el.querySelector('div.move').addEventListener 'mousedown', ui.dragstart, false
     el
   dragstart: (e) ->
     #prevent text selection
     e.preventDefault()
     ui.el = el = @parentNode
-    d = document
     d.addEventListener 'mousemove', ui.drag, false
     d.addEventListener 'mouseup',   ui.dragend, false
     #distance from pointer to el edge is constant; calculate it here.
@@ -124,23 +121,24 @@ ui =
     ui.dx = e.clientX - rect.left
     ui.dy = e.clientY - rect.top
     #factor out el from document dimensions
-    ui.width  = document.body.clientWidth  - el.offsetWidth
-    ui.height = document.body.clientHeight - el.offsetHeight
+    ui.width  = d.body.clientWidth  - el.offsetWidth
+    ui.height = d.body.clientHeight - el.offsetHeight
   drag: (e) ->
-    e.preventDefault()
     {el} = ui
     left = e.clientX - ui.dx
-    if left < 10 then left = '0px'
-    else if ui.width - left < 10 then left = ''
-    right = if left then '' else '0px'
-    el.style.left  = left
-    el.style.right = right
+    if left < 10 then left = '0'
+    else if ui.width - left < 10 then left = null
+    right = if left then null else 0
     top = e.clientY - ui.dy
-    if top < 10 then top = '0px'
-    else if ui.height - top < 10 then top = ''
-    bottom = if top then '' else '0px'
-    el.style.top  = top
+    if top < 10 then top = '0'
+    else if ui.height - top < 10 then top = null
+    bottom = if top then null else 0
+    #using null instead of '' is 4% faster
+    #these 4 statements are 40% faster than 1 style.cssText
+    el.style.top    = top
+    el.style.right  = right
     el.style.bottom = bottom
+    el.style.left   = left
   dragend: ->
     #{id} = {el} = ui
     #equivalent to
@@ -149,7 +147,6 @@ ui =
     {id} = el
     localStorage["#{id}Left"] = el.style.left
     localStorage["#{id}Top"]  = el.style.top
-    d = document
     d.removeEventListener 'mousemove', ui.drag, false
     d.removeEventListener 'mouseup',   ui.dragend, false
   hover: (e) ->
@@ -159,21 +156,20 @@ ui =
     height = el.offsetHeight
 
     top = clientY - 120
-    bot = top + height
     el.style.top =
       if clientHeight < height or top < 0
-        '0px'
-      else if bot > clientHeight
-        clientHeight - height + 'px'
+        0
+      else if top + height > clientHeight
+        clientHeight - height
       else
-        top + 'px'
+        top
 
     if clientX < clientWidth - 400
-      el.style.left = clientX + 45 + 'px'
-      el.style.right = ''
+      el.style.left  = clientX + 45
+      el.style.right = null
     else
-      el.style.left = ''
-      el.style.right = clientWidth - clientX + 45 + 'px'
+      el.style.left  = null
+      el.style.right = clientWidth - clientX + 45
 
   hoverend: (e) ->
     ui.el.style.top = 'auto'
@@ -1109,6 +1105,7 @@ qr =
     dialog = ui.dialog 'qr', top: '0px', left: '0px', html
 
     $.bind $('input[name=name]', dialog), 'mousedown', (e) -> e.stopPropagation()
+    $.bind $('a[name=close]', dialog), 'click', -> $.rm dialog
     $.bind $('#autohide', dialog), 'click', qr.cb.autohide
     $.bind $('img', dialog), 'click', Recaptcha.reload