diff --git a/source/Ox.UI/js/Core/Ox.Element.js b/source/Ox.UI/js/Core/Ox.Element.js
index cb41e786..9da44fba 100644
--- a/source/Ox.UI/js/Core/Ox.Element.js
+++ b/source/Ox.UI/js/Core/Ox.Element.js
@@ -90,6 +90,8 @@ Ox.Element = function(options, self) {
             element: self.options
         };
     }
+    // array of callbacks bound to any event
+    self.eventCallbacks = [];
     // create event handler
     // (this can be passed as part of self)
     if (!self.$eventHandler) {
@@ -97,23 +99,25 @@ Ox.Element = function(options, self) {
     }
 
     // create public object
-    var that = new Ox.JQueryElement(
-            $(self.options.element || '<div>')
-        )
-        .addClass('OxElement')
-        .mousedown(mousedown);
+    var that = new Ox.JQueryElement($(self.options.element || '<div>'))
+            .addClass('OxElement')
+            .mousedown(mousedown);
 
     setTooltip();
 
-    function bind(action, event, callback) {
-        self.$eventHandler[action]('ox_' + event, function(event, data) {
-            callback.call(that, Ox.extend({
-                _element: that.$element,
-                _event: event
-            }, data || {}));
+    function bind(event, callback, once) {
+        self.$eventHandler[
+            once ? 'one' : 'on'
+        ]('ox_' + event, function(event, data) {
+            call(callback, data, event);
         });
     }
 
+    function call(callback, data, event) {
+        event.ox_type = event.type.replace(/^ox_/, '');
+        callback.call(that, data || {}, event);
+    }
+
     function mousedown(e) {
         /*
         better mouse events
@@ -158,14 +162,14 @@ Ox.Element = function(options, self) {
                     });
                     // trigger dragstart, set up drag events
                     that.triggerEvent('dragstart', e);
-                    $('*').bind({
+                    $('*').on({
                         mouseenter: dragenter,
                         mouseleave: dragleave
                     });
                     clientX = e.clientX;
                     clientY = e.clientY;
                     Ox.UI.$window
-                        .unbind('mouseup', mouseup)
+                        .off('mouseup', mouseup)
                         .mousemove(mousemove)
                         .one('mouseup', function(e) {
                             // stop checking for mouserepeat
@@ -173,9 +177,9 @@ Ox.Element = function(options, self) {
                             // stop checking for dragpause
                             clearTimeout(dragTimeout);
                             // stop checking for drag
-                            Ox.UI.$window.unbind('mousemove', mousemove);
+                            Ox.UI.$window.off('mousemove', mousemove);
                             // stop checking for dragenter and dragleave
-                            $('*').unbind({
+                            $('*').off({
                                 mouseenter: dragenter,
                                 mouseleave: dragleave
                             });
@@ -248,28 +252,28 @@ Ox.Element = function(options, self) {
                 that.$tooltip = Ox.Tooltip({
                     title: self.options.tooltip
                 });
-                that.bind({
+                that.on({
                     mouseenter: mouseenter
-                }).unbind({
+                }).off({
                     mousemove: mousemove
                 });
             } else {
                 that.$tooltip = Ox.Tooltip({
                     animate: false
                 });
-                that.bind({
+                that.on({
                     mousemove: mousemove
-                }).unbind({
+                }).off({
                     mouseenter: mouseenter
                 });
             }
-            that.bind({
+            that.on({
                 mouseleave: mouseleave
             });
         } else {
             if (that.$tooltip) {
                 that.$tooltip.remove();
-                that.unbind({
+                that.off({
                     mouseenter: mouseenter,
                     mousemove: mousemove,
                     mouseleave: mouseleave
@@ -289,6 +293,7 @@ Ox.Element = function(options, self) {
 
     /*@
     bindEvent <function> Binds a function to an event
+        (callback)               -> <o> This element
         (event, callback)        -> <o> This element
         ({event: callback, ...}) -> <o> This element
         callback <f> Callback function
@@ -297,9 +302,13 @@ Ox.Element = function(options, self) {
             Event names can be namespaced, like <code>'click.foo'</code>
     @*/
     that.bindEvent = function() {
-        Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
-            bind('bind', event, callback);
-        });
+        if (Ox.typeOf(arguments[0]) == 'function') {
+            self.eventCallbacks.push(arguments[0]);
+        } else {
+            Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
+                bind(event, callback);
+            });
+        }
         return that;
     };
 
@@ -314,7 +323,7 @@ Ox.Element = function(options, self) {
     @*/
     that.bindEventOnce = function() {
         Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
-            bind('one', event, callback);
+            bind(event, callback, true);
         });
         return that;
     };
@@ -445,6 +454,7 @@ Ox.Element = function(options, self) {
     @*/
     that.triggerEvent = function() {
         Ox.forEach(Ox.makeObject(arguments), function(data, event) {
+            var type = 'ox_' + event;
             if ([
                 'mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick',
                 'dragstart', 'drag', 'dragenter', 'dragleave', 'dragpause', 'dragend',
@@ -458,7 +468,10 @@ Ox.Element = function(options, self) {
             // it is necessary to check if self.$eventHandler exists,
             // since, for example, when removing the element on click,
             // singleclick will fire after the removal of the event handler
-            self.$eventHandler && self.$eventHandler.trigger('ox_' + event, data);
+            self.$eventHandler && self.$eventHandler.trigger(type, data);
+            self.eventCallbacks.forEach(function(callback) {
+                call(callback, data, {type: type});
+            });
         });
         return that;
     };
@@ -468,22 +481,30 @@ Ox.Element = function(options, self) {
         To unbind a specific handler, use namespaced events, like
         <code>bindEvent('click.foo', callback)</code>, and then
         <code>unbindEvent('click.foo')</code>.
-        () -> <object> This element object
-            Unbinds all events
-        (event) -> <object> This element object
-            Unbinds one event
-        (event, event, ...) -> <object> This element object
-            Unbinds multiple events
-        ([event, event, ...]) -> <object> This element object
-            Unbinds multiple events
+        () -> <object> This element
+            Unbinds all callbacks from all events
+        (callback) -> <o> This element
+            Unbinds one callback from all events
+        (event) -> <o> This element
+            Unbinds all callbacks from one event
+        (event, callback) -> <o> This element
+            Unbinds one callback from one event
+        ({event: callback}, ...) -> <o> This element
+            Unbinds multiple callbacks from multiple events
         event <string> Event name
     @*/
     that.unbindEvent = function() {
+        var callback = arguments[0];
         if (arguments.length == 0) {
-            self.$eventHandler.unbind();
+            self.eventCallbacks = [];
+            self.$eventHandler.off();
+        } else if (Ox.typeOf(callback) == 'function') {
+            self.eventCallbacks = self.eventCallbacks.filter(function(fn) {
+                return fn !== callback;
+            });
         } else {
-            Ox.toArray(arguments).forEach(function(event) {
-                self.$eventHandler.unbind('ox_' + event);
+            Ox.makeObject(arguments).forEach(function(callback, event) {
+                self.$eventHandler.off('ox_' + event, callback);
             });
         }
         return that;