Прокрутка DIV с помощью кнопок и мыши

Question

У меня есть DIV с прокруткой переполнения. И я хочу добавить 2 кнопки для прокрутки этого раздела вверх и вниз. Я могу найти способ или прокрутить с помощью мыши. Или прокрутите с помощью кнопок, потому что они хотят, чтобы я переполнял скрытый.

Есть ли способ сделать то и другое?

Answer 1

Попробуйте это:

var step = 25; 
var scrolling = false; 

// Wire up events for the 'scrollUp' link: 
$("#scrollUp").bind("click", function (event) { 
    event.preventDefault(); 
    // Animates the scrollTop property by the specified 
    // step. 
    $("#content").animate({ 
     scrollTop: "-=" + step + "px" 
    }); 
}).bind("mouseover", function (event) { 
    scrolling = true; 
    scrollContent("up"); 
}).bind("mouseout", function (event) { 
    scrolling = false; 
}); 


$("#scrollDown").bind("click", function (event) { 
    event.preventDefault(); 
    $("#content").animate({ 
     scrollTop: "+=" + step + "px" 
    }); 
}).bind("mouseover", function (event) { 
    scrolling = true; 
    scrollContent("down"); 
}).bind("mouseout", function (event) { 
    scrolling = false; 
}); 

function scrollContent(direction) { 
    var amount = (direction === "up" ? "-=1px" : "+=1px"); 
    $("#content").animate({ 
     scrollTop: amount 
    }, 1, function() { 
     if (scrolling) { 
      scrollContent(direction); 
     } 
    }); 
} 

Working fiddle