Cybervanes
asked on
jQuery Animate a set of 10 elemets each starting at diffrent times.
i'm just curious if there is a way to optimize this code that animates a list of 10 results at a time.
Is there a way to det up some type of timed loop or something like that?
Is there a way to det up some type of timed loop or something like that?
function GetNextTen(whatToDo,currentLimit){
currentLimitSplit = currentLimit.split(',');
currentLimitSplit[0] = parseFloat(currentLimitSplit[0])+10;
currentLimit = currentLimitSplit.join(',');
var value = 'WhatToDo='+whatToDo+'&limit='+currentLimit;
$('#event-1').animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-2').delay(50).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-3').delay(100).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-4').delay(150).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-5').delay(200).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-6').delay(250).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-7').delay(300).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-8').delay(350).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-9').delay(400).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$('#event-10').delay(450).animate({"left": "-850px", "opacity": ".1"},
300, // how fast we are animating
'easeInExpo' // the type of easing
);
$.ajax({
type: 'GET',
url: 'includes/HomePageEventListings.php?'+value,
success: function(msg){
//$("#JobInformation").html('');
// $("#findTicketsListCont").hide();
$("#findTicketsListCont").delay(600).html(msg)
$('.shown').addClass('outOfSight');
$('#event-1').animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-2').delay(50).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-3').delay(100).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-4').delay(150).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-5').delay(200).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-6').delay(250).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-7').delay(300).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-8').delay(350).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-9').delay(400).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
$('#event-10').delay(450).animate({"left": "-=850px", "opacity": "1"},
600, // how fast we are animating
'easeInOutExpo' // the type of easing
);
}
});
}
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.