Hi everyone,

I have a strange jquery problem with multiple event handlers. What I'm trying to achieve is this:

1. User selects some text on the page
2. If the selection is not empty - show a context menu
3. If user clicks somewhere else - the context menu should disappear

I'm having troubles with the above i.e. sometimes the context menu appears correctly, sometimes it appears and disappears straight after user makes a selection. Please help. See the relevant parts of my code below. Also when user selects a paragraph or a word by double clicking - context menu appears and quickly disappears again.

var ContextMenu = {
   ...
        show: function(e) {
            var z = this;
            if (!this.shown) {
                if (this.contextMenu) {
                    this.contextMenu.css({
                        left: e.pageX,
                        top: e.pageY
                    }).slideDown('fast');
                    this.shown = true;
                }
                var hideHandler = function() {
                    z.hide(this);
                };
                $(document.body).bind("click", hideHandler);
            }
        },
        hide: function(hideHandler) {
            if (this.contextMenu && this.shown) {
                this.contextMenu.slideUp('fast');
                this.shown = false;
                $(document.body).unbind("click", hideHandler);

            }
        }
};
    // Context menu display logic
    $(document.body).bind("mousedown mouseup", function(e) {
        if ((window.getSelection().toString() != "") && (!ContextMenu.shown)) {
            ContextMenu.show(e);
        }
    });