var page = $("html,body");
var fx = function(elem, target) {
    var
        avaiableToScroll = ($(document).height() - $(window).height()),
        scrollTop = $(document).scrollTop(),
        scrollBottom = ($(document).height() - $(window).height()) - $(document).scrollTop(),
        scrollTo = target == 0 ? scrollTop : scrollBottom;

    return elem.animate({scrollTop: target}, {duration: (((scrollTo/avaiableToScroll) || 1) * 400), easing: "linear"});
};
$('.subir').on('mousedown', function (e) {
    e.preventDefault();
    e.stopPropagation();
    fx(page, 0);
});

$('.descer').on('mousedown', function(e) {
    e.preventDefault();
    e.stopPropagation();
    fx(page, ($(document).height() - $(window).height()));
});
$('.subir,.descer').on('mouseup', function (e) {
    e.preventDefault();
    e.stopPropagation();
    page.stop(true, false);
});

$(window).scroll(function(){
    var scrollTop = $(document).scrollTop();
    if(scrollTop === 0){
        $('.subir').css('opacity', .5);
        $('.descer').css('opacity', 1);
    }
    else if(scrollTop === ($(document).height() - $(window).height())){
        $('.subir').css('opacity', 1);
        $('.descer').css('opacity', .5);
    }
    else{
        $('.subir').css('opacity', 1);
        $('.descer').css('opacity', 1);
    }
}).trigger('scroll');