Just nu i M3-nätverket
Gå till innehåll
adji

Positivt blir negativt

Rekommendera Poster

adji

Jag har ett litet script som beter sig underligt, enligt mig :)

 

if (document.getElementById && document.getElementById(id))
{
var el = document.getElementById(id); 
}


curr_hojd = el.offsetHeight;

ny_hojd = (curr_hojd - 5)

 

Låt oss säga att att curr_hojd resulterar i 10, då resulterar ny_hojd i 15, inte 5. Någon som kan förklara varför?

 

[inlägget ändrat 2006-05-15 09:49:51 av daniel@senap]

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Mr Andersson

Har du verifierat att curr_hojd verkligen innehåller 10, tex med alert(curr_hojd)?

 

 

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji

Jo jag har testat så att curr_hojd kommer ut så det stämmer.

Problemet ligger i att jag kör detta i en loop (eller en timeout egentligen), och lagret (som det handlar om) växer istället för att krympa.

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji
Har du verifierat att curr_hojd verkligen innehåller 10, tex med alert(curr_hojd)?

 

Lås oss säga att curr_hojd är undefined, är det då logiskt/korrekt att få ett posetivt värde vid substration?

Det som ter sig underligt är ju i så fall att lagret i sig fortsätter öka i den intervall jag kör,

 

undefined - 5 

 

borde ju i sådant fall att curr_hojd är underfined vara konstant varje gång loopen körs?

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT

Hej!

 

Antingen borde du få NaN eller så borde du få -5 om undefined räknas som null... tror jag.

 

Men det är inte så att du har en variabel som är -5 och att du sedan kör curr_hojd - variabel... I så fall blir det ju 15.

 

Håller med om att det verkar konstigt. Kanske blir lättare att felsöka om du lägger upp mer kod...

/Tjo

H

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji

Här kommer hela funktionen, jag har för vana att kommentera på engelska tyvärr(?) så ni får ha överseende.

 

function doljLager(id,width,height,speed,opacityTar)
{
// fakey speed convert to ensure int value
var speeda = +speed

// fetch layer
//var el = document.getElementById(id);
if (document.getElementById && document.getElementById(id))
{
	var el = document.getElementById(id); 
}

// get current size of layer
h_size1 = el.offsetHeight;
v_size1 = el.offsetWidth;



// get size of screen
if (self.innerWidth)
{
	var frameWidth = self.innerWidth;
	var frameHeight = self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth)
{
	var frameWidth = document.documentElement.clientWidth;
	var frameHeight = document.documentElement.clientHeight;
}
else if (document.body)
{
	var frameWidth = document.body.clientWidth;
	var frameHeight = document.body.clientHeight;
}



var widthStepper = Math.round((width/100) *speeda);
var heightStepper = Math.round((height/100) *speeda);



// the loop de loop
if (h_size1 > 50 || v_size1 > 50)
{
	//centers the layer
	if(!navigator.appName.match("Microsoft"))
	{
		var topPos = ((frameHeight/2) - (h_size1/2)) + window.pageYOffset;

	}else{
		if (document.documentElement && document.documentElement.scrollTop)
		{
			//theTop = document.documentElement.scrollTop;
			var topPos = ((frameHeight/2) - (h_size1/2)) + document.documentElement.scrollTop;
		}else{
			//theTop = document.body.scrollTop
			var topPos = ((frameHeight/2) - (h_size1/2)) + document.body.scrollTop;
		}	
	}


	var leftPos = ((frameWidth/2) - (v_size1/2));

	// ensures us that the layer doesnt cover the cats
	if(topPos< 200) { topPos = 210; }

	// and here we place the layer
	el.style.top = topPos + "px";
	el.style.left = leftPos + "px";

	// här blir det knas!

	if(h_size1 > height)
	{
		// updates the height of the layer
		el.style.height = (h_size1-5)+"px";
	}
	if(v_size1 > width)
	{
		// updates the width of the layer
		el.style.width = (v_size1-5)+"px";
	}


	//dont animate opacity in Explorer, just set it
	if(!navigator.appName.match("Microsoft"))
	{
		if(el.style.opacity > 0)
		{
			var opacity = ((el.style.opacity*10) - 1)/10
			el.style.opacity=opacity
		}
	}

	// defines a timeout to get that sweet animated effect
	w = setTimeout("doljLager('" + id + "','" + width + "','" + height + "', '" + speed +"','" + opacityTar + "')", 1);

}else{
	// clear the timeout when target size is set
	clearTimeout(w)
}
}

 

Saken är den att jag från början gjorde koden för att expandera lager, sedan när jag bara tänka "vända på den" för att minimera lagren så ville det sig inte och lagret bara växer med 5px i taget istället.

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT

Kan inte se några direkt fel vid en första hastig titt. Borde ju inte kunna räkna fel när det ser ut så där tycker jag. Men jag är inte riktigt med var alla hakar börjar och slutar nu. Måste jobba lite men försöker kolla noggrannare senare... ikväll i värsta fall...

/Tjo

H

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji

Tack HeT! Uppskattas verkligen

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT

Hej!

 

Nu har jag testat din funktion.... och den beter sig nog ungefär som den ska för mig... tror jag...

Provade det hela genom att ha en div med height: 200px och width: 200px och bad den minska det hela till 40x40 px genom att kalla på funktionen via en knapp. Och min div minskar snällt i storlek. Det var väl det som var tänkt att hända. Däremot så var det inte så kul att ha en alert med, speciellt inte som jag hade blablabla som text i diven för då kommer aldrig width minska tillräckligt mycket i IE så att clearTimeouten går.. Men annars tycker jag det funkade.

 

Varför säger if-en att jag måste minska till minst 50x50 innan clearTimeout? Åkte dit på den första gången när jag bara minskade height till 100. Kommer ju liksom inte ur det då... Vore bättre om den kände av värdena jag vill sluta på.

 

Men som sagt annars rullade det... Har jag fattat allt fel?

/Tjo

H

 

[inlägget ändrat 2006-05-15 19:28:06 av HeT]

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji
Varför säger if-en att jag måste minska till minst 50x50 innan clearTimeout? Åkte dit på den första gången när jag bara minskade height till 100. Kommer ju liksom inte ur det då... Vore bättre om den kände av värdena jag vill sluta på.

 

Oj det var smuts från lite försök till debug. Har aldrig tänkt på att innehållet kan ställa till det, ska testa vidare. Tack för hjälpen.

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji

Jag får det fortfarande inte att funka,

lagret bara växer när jag kallar på funktionen, jag har snart inget hår kvar på huvudet...

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT

Men hur sjutton gör du då???

 

Jag använde din javascriptfunktion och lade till följande på en sida och tutade...

 

<input type="button" onclick="doljLager('test' , 40, 40, 500, null);">

<div id="test" style="background-color: yellow; width: 200px; height: 200px;"> BLA BLA BLA BAL</div>

 

Om jag dessutom absolutpositionerar diven så hamnar den snällt och fint centrerad på sidan.

Vad gör jag som inte du gör?

/H

 

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Micke_skane

Jag testade även det och det fungerar fint både i IE och FF.

 

Vad gör jag som inte du gör?
Pratar fint med din dator så ni är vänner :)

 

jag har snart inget hår kvar på huvudet...
Har du testat enbart med denna funktionen på en sida?

Alltså inget annat som "stör".

 

[inlägget ändrat 2006-05-16 11:13:25 av Micke_skane]

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT
Har du testat enbart med denna funktionen på en sida?

Ja naturligtvis... PROVA!

 

Pratar fint med din dator så ni är vänner :)

Hmmm... Vid speciellt högtidliga tillfällen brukar jag nog ösa rätt mycket grova uttryck över den... trots att man vet att den egentligen bara gör som man säger åt den och att det egentligen alltid är ens eget fel... Fast det är klart ganska ofta är det ju Microsofts fel också...

Men jag putsar på den ibland också... och det har hänt att jag matat den med kaffe... fast inte den här... det var den gamla...

 

 

/Tjo

H

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Micke_skane
Ja naturligtvis... PROVA!
Att du hade gjort det var rätt klart :)

Men frågan var till han som snart inte hade nått hår på huvudet.

 

trots att man vet att den egentligen bara gör som man säger åt den och att det egentligen alltid är ens eget fel
Ja, det är väl bara att inse att så är det :)

 

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT

Jo men jag menade bara att du har antagligen har rätt... som så många gånger förut. Att det antagligen är nåt annat som stör ut det för den tunnhårige... Kanske jag också borde ha kunnat tänka ut...

/H

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Micke_skane

Det är en riktigt klassiker att skriva saker till varandra kan uppfattas helt olika. Man läser samma sak men uppfattar det helt olika.

 

Det är lugnt :)

 

Kanske jag också borde ha kunnat tänka ut
Även Ingmar Stenmark ramlade...

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji
Jag använde din javascriptfunktion och lade till följande på en sida och tutade...

 

<input type="button" onclick="doljLager('test' , 40, 40, 500, null);">

<div id="test" style="background-color: yellow; width: 200px; height: 200px;"> BLA BLA BLA BAL</div>

 

Om jag dessutom absolutpositionerar diven så hamnar den snällt och fint centrerad på sidan.

Vad gör jag som inte du gör?

 

Nu testade jag att plocka loss endast detta på en egen sida, då funkar det. Nu blir man ju ännu mer fundersam...

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Micke_skane
Nu blir man ju ännu mer fundersam...
Varför då :)

Nu vet du ju att den funktionen fungerar så nu är det bara att stoppa in det andra materialet igen, bit för bit, och se när det blir fel.

 

Gammal hederlig felsökning :)

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
adji

OK nu har jag "löst" det.

 

Lägger jag padding på lagret i med css så skiter sig alltihopa och den börjar expandera. Så _logiskt_ (ehum ironi) var det.

 

Kan ju förstå det bitvis eftersom offsetHeight mäter den egentliga höjden, inklusive padding, borders etc.

 

Men att den växer tycker jag ändå är knas.

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
HeT

Hej!

Nej, det är väl helt logiskt, tror jag.

Med offsetHeight får du, som du säger, ut den totala höjden med padding och allt. Om du då har en padding: 5px och i din funktion sätter om style.height = offsetHeight -5 så blir ju det style.height + style.paddingTop + style.paddingBottom - 5 , vilket betyder att du ökar height med 5...

J-ligt dåligt förklarat kanske men det är nog så det blir tänker jag...

 

[EDIT] Om du vill få det att funka med padding måste du med andra ord räkna bort paddingen också height = offsetHeight - paddingTop-paddingBottom -minskningsvärde

 

Och borders då naturligtvis... eller få fram höjden på något annat sätt...

/H

[inlägget ändrat 2006-05-17 10:50:55 av HeT]

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Skapa ett konto eller logga in för att kommentera

Du måste vara medlem för att kunna kommentera

Skapa ett konto

Skapa ett nytt konto på vårt forum. Det är lätt!

Registrera ett nytt konto

Logga in

Redan medlem? Logga in här.

Logga in nu



×
×
  • Skapa nytt...