jQuery: Animation

Naja du willst die Animation für jeden Balken ausführen und die jede Animation muss einen berechneten Wert (Höhe) haben, oder?

Hier der Pseudo-Code:
Javascript:
var akt = myJSON.votedata[i];
              $('#bar_' + akt.id).effect('pulsate', options, 600, function() {
                $(this).find(".balken").each(function(index,balken){
					var balkenbreite = $(balken).width();
					$(balken).animate({
                  height: Math.round((balkenbreite / anzmax) * akt.anz)
                }, 1500);
					
				});
              });
 
Zuletzt bearbeitet von einem Moderator:
auch nicht, ich weiß gar nicht wie ich es beschreiben soll...

ich kann INNERHALB der funktion nicht auf das object "akt" zugreifen. wenn ich diese code ausführe bekomme ich nacheinander die messageboxen

Code:
alert('nr '+akt.id);
$('#bar_'+akt.id).effect('pulsate',{times:1},600,function() {
	alert(akt.id);
});

nr 1, nr 2, nr 3, nr 4, 4, 4, 4, 4

aber warum? akt ist immer das aktuelle JSON-object aber jQuery will nicht mitspielen...
 
leg die JSON Objekte "im richtigen Scope" ab und greife aus dem Callback auf die JSON-Daten zu, statt auf die aktuelle Referenz. Das heißt, bei jedem Zugriff über das Array mit JSON Objekten drüber laufen.

Pseudo-Code:
var arrayWithJSONData = [{id:"bar_1", height:20},{id:"bar_2"}, ...]

var findDataById = function(id){
for(var index in arrayWithJSONData){
var currentData = arrayWithJSONData[index];
if(currentData.id == id){
return currentData;
}
}
}

for(.....){
$('#bar_'+akt.id).effect('pulsate',{times:1},600,function() {
var akt = findDataById(this.id);
usw.....
});
}
 
Zuletzt bearbeitet von einem Moderator:
Hallo,

am einfachsten wäre es wohl, wenn man die Daten direkt im DOM-Objekt speichert:
Javascript:
var akt = myJSON.votedata[i];
var bar = $('#bar_'+akt.id);
bar.data('target_height', Math.round((balkenbreite/anzmax)*akt.anz));
bar.effect('pulsate',options,600,function() {
	$(this).find('.balken').animate({
		'height': $(this).data('target_height')
	}, 1500);
});

Grüße,
Matthias
 
Die Idee mit dem DOM-Objekt ist genauso genial wie einfach...

Damit komme ich sicherlich ein Stück weiter,
vielen Dank für den Tipp!
 

Neue Beiträge

Zurück