mousedown on scrollTop : return false - problem

Question

i found a code here, to let the mouse on the click and scroll the content of a div. But, when i try it, the return false or preventDefault doesn't prevent the click, and relaunch the page. Do you know how i could make this code work? the alert works well, but then the code refresh the page :

var scrolling = false;
        $('#cat-diapo').find('#lien-fleche-cat').mousedown(function(e){
               var sous_cat = $(this).parent().prev('.sous-cat');
               //var sous_cat = $('.sous-cat');
               //var direction = '+=';
               //sous_cat.animate({scrollTop: direction + 5}, 10);
                scrolling = true;
                alert('allop');
                //return false;
                e.preventDefault();
                //startScrolling(sous_cat, '+=10');


        })
        /*
        .mouseup(function(){
                scrolling = false;
        });*/


        function startScrolling(obj, param){
            if (!scrolling) {
                obj.stop();
            } else {
                obj.animate({"scrollTop": param}, "fast", function(){
                if (scrolling) { startScrolling(obj, param); }
                });
            }
        }

Thanks

Answer 1

You need to preventDefault() on the click specifically. You should be able to do something like this:

$('#cat-diapo').find('#lien-fleche-cat').bind({
    mousedown: function(){
        var sous_cat = $(this).parent().prev('.sous-cat');
        scrolling = true;
        alert('allop');
    },
    click: function(e){
        e.preventDefault();
    }
});

That is just a quick edit from your code. Put whatever you need to happen in the mousedown function.