event.preventDefault() not preventing normal <a> action

Question

I am making dragscroller for my div. The draging works, but the div which I drag around has some <a> tags inside. When I grab the div at the same position as the <a> tag (or link) it still redirects me to the linked page.

I am using these codes to prevent them from redirecting after a grab:

//Inside the mouseMoveHandler
    if(delta!=0){
        prevent=1;
    }
//Inside the mouseUpHandler
    if(prevent){
        alert('at this point he should prevent clicking on a link, but he does not');
        prevent=0;
        event.preventDefault();
        return false;
    }

The alert is appearing on the screen, but the event.preventDefault(); and return false; do not seem to work.

I also tried event.stopPropagation() to stop the default link to occur without result.

The snippets codes above can also be found in the complete code bellow:

var dragscroll= {
            mouseDownHandler : function(event) { // mousedown, left click
                // Initial coordinates will be the last when dragging
                event.data.lastCoord = event.clientY; 
                $.event.add( document, "mouseup", dragscroll.mouseUpHandler, event.data );
                $.event.add( document, "mousemove", dragscroll.mouseMoveHandler, event.data );
            },
            mouseMoveHandler : function(event) { // User is dragging
                // How much did the mouse move?
                delta = event.clientY - event.data.lastCoord;
                // Set the scroll position relative to what ever the scroll is now
                event.data.scrollable.scrollTop(event.data.scrollable.scrollTop() - delta);
                // Save where the cursor is
                event.data.lastCoord=event.clientY
                if(delta!=0){
                    prevent=1;
                }
            },
            mouseUpHandler : function(event) { // Stop scrolling
                    $.event.remove( document, "mousemove", dragscroll.mouseMoveHandler);
                    $.event.remove( document, "mouseup", dragscroll.mouseUpHandler);
                if(prevent){
                    alert('at this point he should prevent clicking on a link');
                    prevent=0;
                    event.preventDefault();
                    return false;
                }

            }
    }

Answer 1

Try attaching another handler to all a tags where you check a variable and return if its true. Name variable dragging. Set dragging to false at mouse up.

Problem is event propogate in to out so if you set preventDefault on container then events wont go to its parent and wont affect children since they are one passing the event to it