Прокрутите div в центр div

Question

Это модель моей структуры div.

<div id="fruitWrapper"> 
    <div id="lychee">LYCHEE</div> //info div 1 
    <div id="mango">MANGO</div> //info div 2 
    <div id="apple">APPLE</div> //info div 3 
    <div id="papaya">PAPAYA</div> //info div 4 
    <div id="pineapple">PINEAPPLE</div> //info div 5 
</div> 

У меня есть около 75 info divs вложенных #fruitWrapper. Все info divs равны по высоте. Я ограничил высоту #fruitWrapper до 1½ раза по высоте одного info div (ширина составляет 100% от ширины страницы).

.info_div{ 
    display: inline-block; 
} 

У меня есть 75 значков на странице. Как я могу сделать конкретный info div для прокрутки до центра #fruitWrapper?

showInfo(papaya); 
function showInfo(fruit) { 
     $('#fruitWrapper').scrollTop($('#fruitWrapper').scrollTop() + $('#'+fruit).position().top - $('#fruitWrapper').height()/2 + $('#'+fruit).height()/2); 
}); 

Answer 1

Вы имеете в виду что-то вроде этого? http://jsfiddle.net/0vp7gwe3/

showInfo('papaya'); 

function showInfo(fruit) { 
    console.log($('#' + fruit)); 
    $('#fruitWrapper').animate({ 
     scrollTop: $("#" + fruit).offset().top 
    }, 'slow'); 
}