Hallo, ich habe mir dieses kleine Script geschrieben und nun ein Problem damit.
Es animiert eine Ebene, welche nach links bzw. rechts verschoben wird. Es
funktioniert soweit auch ganz gut, allerdings wenn man die Animation auslöst
während sie bereits läuft, wird beim aktuellen Stand unterbrochen und neu gestartet.
Das möchte ich verhindern, bedeutet so lange die Animation läuft, soll keine neue
ausgelöst werden können. Irgendwie komme ich da aber nicht weiter.

Hier einfach mal das Script:

HTML-Code:

    var slideShow = {        
        initialize: function(imgs) {
            var btnLeft = document.getElementById('toTheLeft');
            var btnRight = document.getElementById('toTheRight');
            btnLeft.onclick = slideShow.left;
            btnRight.onclick = slideShow.right;
        },
        left: function() {
            var imgs = 13;
            var last = imgs*120-5*120;
            var obj = document.getElementById('slideShow');    
            var from = obj.style.left;
            from = from.replace(/px/, "");
            if(from >= (-last)) {
                slideShow.animate(obj,from,'left');
            }
        },
        right: function() {
            var obj = document.getElementById('slideShow');    
            var from = obj.style.left;
            from = from.replace(/px/, "");
            if(from < 0) {
                slideShow.animate(obj,from,'right');
            }
        },
        animate: function(obj,from,styleProperty) {
            var progress=0.0;
            var timerId;
            timerId = setInterval(
                function() {
                    progress+=20;    
                    if(progress == 480) {
                        clearInterval(timerId);
                    }
                    if(obj) {
                        if(styleProperty == 'left') {
                            obj.style.left = from - progress+"px";
                        } else {
                            obj.style.left = + from + progress+"px";
                        }
                    }
                },
                20
            );        
        }        
    }

Wir ihr seht soll die Ebene immer +/- 480px verschoben werden. Wenn man die Animation nun neu startet wenn sie sich momentan erst bei 240px befindet, dann werden die 480px neu gestartet und insgesamt wurde die Ebene also 720px verschoben. Kann ich irgendwie abfragen ob der Interval aktiv ist und dann die Funktion
animate nicht ausführen?

Besten Dank.


Zum besseren Verständnis hänge ich einfach nochmal ein funktionsfähiges Beispiel an.

Edit: So, habe es geschafft, gelöst über die Variable "animating" welche gesetzt
wird wenn die Animation läuft und falls diese Variable dann gesetzt ist wird nicht neu gestartet.

HTML-Code:

	var animating = false;
	var slideShow = {		
		initialize: function(imgs) {
			var btnLeft = document.getElementById('toTheLeft');
			var btnRight = document.getElementById('toTheRight');
			btnLeft.onclick = slideShow.left;
			btnRight.onclick = slideShow.right;
		},
		left: function() {
			var imgs = 13;
			var last = imgs*120-5*120;
			var obj = document.getElementById('slideShow');	
			var from = obj.style.left;
			from = from.replace(/px/, "");
			if(from >= (-last)) {
				slideShow.animate(obj,from,'left');
			}
		},
		right: function() {
			var obj = document.getElementById('slideShow');	
			var from = obj.style.left;
			from = from.replace(/px/, "");
			if(from < 0) {
				slideShow.animate(obj,from,'right');
			}
		},
		animate: function(obj,from,styleProperty) {
			if(animating) { 
				return 
			}
			animating = true;
			var progress=0.0;
			var timerId;
			timerId = setInterval(
				function() {
					progress+=20;	
					if(progress == 480) {
						clearInterval(timerId);
						animating = false;
					}
					if(obj) {
						if(styleProperty == 'left') {
							obj.style.left = from - progress+"px";
						} else {
							obj.style.left = + from + progress+"px";
						}
					}
				},
				20
			);		
		}		
	}

Trotzdem:

P.S.: Falls jemand generell Verbesserungsvorschläge parat hat, immer her damit.

Danke