Witam

Chcę zrobić w jquery tak, aby boczny pasek z kategoriami: <div id="kat_blok">...</div> po najechaniu myszką przesuwał się do góry (nakładając się na blok nadrzędny <div id="lokalizacja">...</div>), a po odjechaniu myszką żeby wrócił na swoje miejsce. Wykombinowałem coś takiego:

[JAVASCRIPT] pobierz, plaintext 
var lock = false, lock2 = false;
 
$('#kat_blok').mouseover(function()
{
 
	if(!lock)
	{
		$('#lokalizacja').hide(100);
	}
	lock = true;
 
 
}).mouseout(function()
{
	if(lock){	
		if(!lock2)
		{
			$('#lokalizacja').show(100,function(){lock=lock2=false;});
		}
		lock2 = true;
	}
 
});
[JAVASCRIPT] pobierz, plaintext 

Wygląda to tak, że blok nadrzędny po prostu znika, a w jego miejsce wskakuje blok pod spodem (ale efekt jest osiągnięty). Tylko jest problem - po najechaniu na niego myszką - blok skacze od góry do dołu, a po odjechaniu wraca na swoje miejsce. Jak zrobić, aby po najechaniu blok przeniósł się do góry, a po odjechaniu wrócił na swoje miejsce.

Pozycjonowanie absolutne jest jak najbardziej właściwe, ale dodatkowo trzeba użyć z-index, aby "wyciągnąć" ten boczny pasek nad wszystkie niezbędne warstwy (na sam wierzch). Wtedy te lock-i nie będą potrzebne. Być może trzeba będzie umieścić pozostałą część HTML (zawartość body) w warstwie spodniej, czyli takiej, która ma mniejszą wartość z-index.

W chwili obecnej masz wszystko na jednej warstwie w związku z czym przeglądarka nie rozpoznaje, czy kursor jest nad określonym elementem, czy już nie, tym bardziej, że ten element zmienia położenie (stąd efekt "skakania").