✔ Div Element automatisch verkleinern

[zer0]

Hallo,

ich möchte ein Div automatisch jede Sekunde verkleinern. Dazu verwende ich setInterval();. Das klappt auch, jedoch wird der Div nicht kleiner. Ich kann auf die CSS Eigenschaften paddingTop, paddingBottom etc nicht zugreifen.

So sieht mein Javascript aus:

        var timer = setInterval("smaller('success')", 1000);

	function smaller(element) {		
		var element = document.getElementById(element);
		alert(element);

		if(element.style.paddingTop != null) {
			var paddingTop = element.style.paddingTop;
			paddingTop = paddingTop.substring(0, paddingTop.length - 2);
			
			alert("1: " + paddingTop);
			element.style.paddingTop = ((paddingTop - 1) + "px");
		}
		
		if(element.style.paddingBottom != null) {
			var paddingBottom = element.style.paddingBottom;
			paddingBottom = parseInt(paddingBottom.substring(0, paddingBottom.length - 2));
			
			alert("2: " + paddingBottom);
			element.style.paddingBottom = ((paddingBottom - 1) + "px");
		}
		
		if(element.style.height == null) {
			var elementHeight = element.offsetHeight;
			
			var paddingTop = element.style.paddingTop;
			paddingTop = parseInt(paddingTop.substring(0, paddingTop.length - 2));
			
			var paddingBottom = element.style.paddingBottom;
			paddingBottom = parseInt(paddingBottom.substring(0, paddingBottom.length - 2));
			
			var height = (elementHeight - (paddingTop + paddingBottom));
			
			alert("3: " + height);
			element.style.height = ((height - 1) + "px");
		} else {
			var height = element.style.height;
			height = parseInt(height.substring(0, height.length - 2));
			
			alert("4: " + height);
			element.style.height = ((height - 1) + "px");
		}
		
		if(element.offsetHeight < 2) {
			clearInterval(timer);
		}		
	}

Das Div Element hat die ID 'success'. Ich habe alert(); eingebaut um zu sehen was ausgegeben wird. paddingTop etc ist aber immer leer.

Weiß jemand warum oder kennt jemand eine andere Methode?

 

[Quaese]

Hi,

wurden Grössen nicht über inline-CSS oder über das style-Objekt angegeben, kann JS die Werte unter Umständen nicht auslesen.

Um das zu kompensieren, existieren die Methoden getComputedStyle und currentStyle. Mehr dazu findest du hier.

Ciao
Quaese

 

[zer0]

Genau das wars! Vielen Dank!