Выезжающие снизу элемент
 

Бьюсь, бьюсь, не могу решить след. задачу, нужно сделать окошко с инфой, при наведение мышки на это окошко снизу выезжает блок с кнопками, при убирание с элемента мышки, блок с кнопками уезжает вниз соответственно... Перебрал все анимации и show() и slideDown() и animate(), ничего не подходит, наезд сверху получается без проблем, снизу никак не могу, докопался максимум до этого:

$(".main").mouseover(function () {
		  		$(".focus").animate({ 
					top: "0"
                       }, 1000)
			});

при такой структуре

<div class="wrapGame">
					<div class="main">
						<img src="img/game.jpg" alt="0" />
						<div class="puls">
							<p class="numerPuls">199</p>
							<p class="titlePuls">пульс игры</p>
						</div>
					</div>
					<div class="focus">
						<p>некий текст</p>
						<div class="setup">
							<input type="button" value="Установить" />
						</div>
						<div class="more">
							<input type="button" value="Подробнее" />
						</div>
					</div>
				</div>

При наведение на элемент, блок с кнопками выезжает снизу, но как теперь его убирать вниз, при отведение мышки с элемента, вот так не работает, сразу говорю

$(".main").mouseout(function () {
		  		$(".focus").animate({ 
					top: "300px"
                       }, 1000)
			});

Так вполне себе работает

$(".main").hover(
	function () {
		$(".focus").stop().animate({ top: "0" }, 1000);
	},
	function () {
		$(".focus").stop().animate({ top: "300px" }, 1000);
	}
);

Amphiluke, нет, не совсем работает, т.е. если навести на элемент, он снизу накатывает, но если начать мышку двигать в пределах этого элемент, блок начинает прыгать, т.е. он выкатывается не стабильно, при движение мышки, пытается уехать вниз обратно.

Странно, ничего подобного не наблюдаю.
Вот пример: http://jsfiddle.net/nmbfd/
Водим мыхой по голубой области, зеленая стоит на месте.
Покажите свой неработающий пример

Ааа, все хорошо, не на тот элемент повесил, поэтому работало не стабильно, сейчас отлично, спасибо!