Jquery UI problem .draggable()

Question

Cześć, zaczynam pisać grę (nie patrzcie na interfejs, jest roboczy, żeby tylko było wiadomo co i jak).

Podczas pisania pojawił się pewien problem: w momencie gdy chciałem zrobić obszar mapy oraz funkcję auto-powrotu, gdy użytkownik przeciągnie mapę poza wyznaczony obszar. Wszystko działa jak należy (obecnie jedynie góra-dół), jednak niestety, gdy przesuwam mapę i w trakcie przesuwania najadę np na pasek zadań win, a następnie ją puszczę automatyczny powrót mapy się buguje sprawiając, że pewien obszar staje się zupełnie nieosiągalny (podczas przesuwania funkcja auto powrotu ucina górną lub dolną część). Kod CSS jest IDENTYCZNY przed i po zbugowaniu O.o

Kod CSS/HTML dostępny na stronie z demo:------------

Przed rozwiązaniem: http://lukasz-rzasa.com/test/game-stare/

Rozwiązanie: http://lukasz-rzasa.com/test/game/

 

Część funkcji odpowiadającej za auto powrót (Nie patrzcie na jakość kodu, gdy wszystko będzie działać zostanie on zoptymalizowany, taką wersję wygodniej się edytuje/szuka błędów):

$( "#user-map .map-container" ).draggable({
	stop:function(){
		var w = window.innerWidth;
		var h = window.innerHeight;
		var cw = $('.map-container').width();
		var ch = $('.map-container').height();
		var elem = $('.map-container');
		if(parseInt(elem.css('top'))>0) elem.css('top','0'); 
		else if(parseInt(elem.css('top'))+ch<h){
			elem.css('top',(h-ch)+'px');
		}
		console.log(w+' '+h+' '+cw);
	}
});

Comments

Niezupełnie chodzi o pasek zadań - takowy problem występuje jedynie przy najechaniu kursorem myszy na dolne rejony okna przeglądarki.

---

dlatego napisałem np na pasek zadań, to samo dzieje się po najechaniu na np okno inspektora/konsoli itp. Tak jakby zmieniała się początkowa wartość dla position. Ponieważ wartość top jest zawsze taka sama

Answer 1

Po wielu próbach w końcu się udało, wystarczyło dopisać opcję scroll:false dla funkcji draggable():

$( "#user-map .map-container" ).draggable({scroll: false});