jQuery + zdrzenie + animate mouseenter mouseleave nie dzaiła tak jak chcę

Mam taki króciutki kod i nie wiem jak zrobić aby ta animacja po najechaniu wywoływał się aż do zjechania z tego ma to działać coś jak taki scroll zjeżdżamy na dolną cześć ramki jedzie w dół na górną część ramki to do góry. Ale ta operacja wykonuje mi się tylko raz próbowałem już z pętlami itp. ale tu mamy set time i jakoś się to wiesza przy pętli. Proszę o pomoc ponieważ nie jestem zbyt doświadczony jak na razie w js i jquery.

<div id="up"><img src="./img/up.png"></div>
<div id="komentator"></div>
<div id="down"><img src="./img/down.png"></div>


var obj = $('#komentator');
var current = 0;

$('#up').mouseenter(function(){
	obj.animate({scrollTop: current = current - 5}, 20);
}).mouseleave(function(){
});

$('#down').mouseenter(function(){
	obj.animate({scrollTop: current = current + 5}, 20);
}).mouseleave(function(){
});

1 - zapisywanie zmiennej "current" jest bez sensu - skoro odwołujesz się do właściwości elementu. robisz kopię tej właściwości na zewnątrz, która w dodatku może być nieaktualizowana.

Info dla Ciebie:
Bez sensu jest brać się za robienie animacji w jQuery jak nie masz pojęcia o js, o tym, że elementy dom mają właściwości itd.

Jako rozwiązanie niech posłuży coś takiego:

function scrollElement(selector, diff) {
  var obj = $(selector);
  var st = obj.scrollTop();
  obj.scrollTop(st+diff); // raczej nie chcesz używać tu animacji, skoro sam definiujesz skok.
} 
var scrollTimer=null;
var sleep = 100; // czas w ms pomiędzy przesunięciem
var scrollPx = 5; // ile pikseli przesuwac

$('#up').mouseenter(function() {
  scrollTimer = setInterval(function() {
    scrollElement("#komentator", scrollPx*-1);
  }, sleep);
}).mouseleave(function() {
  clearInterval(scrollTimer);
});
 
$('#down').mouseenter(function() {
  scrollTimer = setInterval(function() {
    scrollElement("#komentator", scrollPx);
  }, sleep);
}).mouseleave(function() {
  clearInterval(scrollTimer);
});

Dzięki bardzo tak jak mówiłem dopiero się uczę jQuery i js. Dzięki wielkie za pomoc widzę że kolega dobrze zna js może by podał jakieś wartościowe kursy i książki.

Wielkie dzięki.

A mam jeszcze jedno pytanko czy da się wykryć w js że element potrzebuje scroll bo chciał bym to tak zrobić, że jak jest potrzebny scroll dodaje 2 elementy typu up i down i przewijam stronę a jak nie ma javy no to normalny scroll.

<div id="komentator">
  <div> tutaj wrzucaj cala tresc, wszystkie elementy, obrazki i co tam masz w treści itd </div>
</div>

var ph = $('#komentator').height();
var ch = $('#komentator>div').height();
if (ch>ph) {
  $('#up, #down').show(); // domyślnie niech #up i #down będą ukryte przy pomocy css
}

Dzięki tak sobie też wymyśliłem. Myślałem że w DOM lub html jest jakiś atrybut co określa tom wartość że scroll jest włączony lub wyłączony.

W sumie jest - nazywa się scrollHeight.
"Zainwestuj" w FireBuga bądź odpowiednik dla Twojej przeglądarki - a jak masz to naucz się korzystać ;)