Pozicija elementa, (mobiteli)

Programiranje
1

Pozdrav,

malo sam zaglavio s razumjevanjem nekih ponašanja prikaza kod mobitela.

Želim postaviti obični div blok na poziciju x,y…i to radi prilično neočekivano.
Recimo, na sljedećem linku možete vidjeti bijele blokove http://bozoou.com/OP_new/trazim_prijevoz
…kad se klikne na bilo koji od bloka, crveni box se postavi na visinu tog bloka. Znači sljedeća logika se desi:

`RedBox.style.top=WhiteBox.offset.top-RedBox.height` 

//(oduzimanje RedBox visine samo da se posloži točno donji border RedBox-a na white box)

E sad, pošto želim znati poziciju whiteBox-a od vrha stranice (a ne samo do njegovog parenta) …koristim određene funkcije da dobijem željene offsete.
Kad se klikne na bijeli box, ti offseti se ispišu unutar boxa…da se to može pratiti.
Ti isti offseti se dodjele RedBox-u, koji je position:absolute i parent mu je body.
Znači ako njemu postavimo poziciju, kao što je offset od whiteBoxa, to bi se trebalo podudarati…i podudara se, ALI:

-radi dobro na destkop verziji
-radi dobro na mobile dok nije ništa scrollano i dok nije mijenjan zoom.
-radi dobro na mobile dok je scrollano i dok nije mijenjan zoom.
-radi dobro na mobile dok nema scrolla i dok je mijenjan zoom.
-radi dobro na mobile dok ima nešto scrolla (čak i do 1500px) i dok je mijenjan zoom.

No, ako se scrola prema dolje više od određenog xx pixela, poludi.

U cijeloj priči, problem zapravo nije problem jer u konačnici web bi trebao biti posložen tako da se ništa ne zoomira…ali čisto sam htio imati jednu lijepu funkciju sa kojom mogu uvijek dohvatiti global poziciju bilo kojeg elementa…isto tako da u tim istim global koordinatama mogu upravljati nekim drugim elementom.

Ali mobiteli se čine to ne podržavaju dobro ili ja negdje griješim??

Ako zanemarimo i ponašanje po vertikalnom scrollu, pogledajte kako se nesuvislo ponaša i pozicija elementa u ovisnosti horizontalnog scrolla.
Mislim, aboslute position zadan element bi uvijek trebao biti na istom mjestu u prostoru, bez obzira gdje se nalazi horizontalni scroll…ali ovaj primjer pokazuje da na mobitelu to tako ne funkcionira??

2

I opet iznova. Bez koda ne mozemo nista znati niti vidjeti.

3

Pa imaš samo

var x=offsetTop(whiteBox)-redBox.getHeight();
redBox.style.top=x+'px';

da se ne zapitaš što je u tim funkcijama, nebi trebalo biti bitno pošto te iste vrijednosti koje dobijem ispisujem unutar svakog bijelog boxa.
Znači možeš samo gledati da od codea imaš: redBox.style.top=x+'px'; gdje x vidiš koji ti je, jer ti je ispisan. I ono što je bitno, vidi se da se x ne mijenja sa promjenom scrolla, dok se pozicija kocki svejedno mijenja uvjetovano scrollom.

Ono malo čudnije, tek određeno velik scroll izbaci kocku sa očekivane pozicije.

4

Everything is clear as mud now !!!

5 
 onload(function()
	{

	$('.whiteBox').on('click',function()
		{
		var scrollPage=getScroll();
		var offset=localOffset(this);
		//scope(offset);
		get('redBox').style.left=offset.left+'px';
		get('redBox').style.top=(offset.top-40)+'px';
		BPopUp.set(this,'greenBox',{side:11,oV:0,oH:0});

		this.innerHTML='scrollPage top:'+scrollPage.top+', left:'+scrollPage.left+'<br/>WHITE : offset top:'+offset.top+' , left:'+offset.left+'<br/> RED : position top:'+(strToInt(get('greenBox').style.top)+20)+' , left:'+get('greenBox').style.left+'';
		})
	});

BPopUp upravlja zelenom kockom…(u njega sam sumnjao da vara, pa sam ubacio crvenu kocku koju upravljam na prilično trivijalan način!) …no zelena i crvena kocka se ponašaju jednako, tako da BPopUp nema veze s ovom pričom…
Crvena kocka se postavlja prilično jednostavno.
Funkciju localOffset se ne mora čekirati iznutra, jer sve što ona baca, to se ispisuje unutar bijelog boxa.
scrollPage treba još manje čekirati…jer ona s ničim nije povezana, osim što se taj podatak također ispisuje…čisto da se vidi da na određenom scrollu nastanu problemi…

6

Probaj na pravim mobitelima, meni je emulator nekada znao praviti probleme ( ako ga koristis ).
event.target ( kada sam radio click na html ) vraca dobre podatke, pokusao elementima dati id-eve i njega citati - sve ok.
Budem napravio jos koji test preko vikenda. zanimljiva situacija ( bug? ) svakako.

7

A na mobitelu (pravom) mi tek i ne radi…na kompu je ockej.
Ali zapravo je “glup” bug, tj. nije povezan sa linijom gdje se dodjeljuje style redBoxu, nego je problem kod dohvaćanja offseta whiteboxa. (kod zooma to prestane točno raditi)

To se vidi tako što se drugačiji parametri offseta ispišu na whiteBoxu za situaciju kad se program normalno ponaša i kad krivo pozicionira redBox (kod zoomiranja)

Ali zapravo ne dolazi do krivog postavljanja redBox-a, nego dolaze drugačiji parametar gdje će se box postaviti :smiley:

Neznam samo kako to odmah nisam primjetio…nekako sam mislio da sam to odmah pogledao.