All I need it to do is run the function animateAds over and over. Can anyone help? This is my code:
function animateAds(n) {
$('#ad_1').fadeIn('slow', function (){
$('#ad_1').delay(100).fadeOut('fast', function (){
$('#ad_2').fadeIn('slow');
});
});
};
$(document).ready(function() {
for (n = 0; n < 10; n++) {
animateAds(n);
}
});
setInterval(function(){animateAds()}, 100);
This would call your function 10 times a second (100 ms each). I stripped the n parameter as it's not used in your code.
Regards.
maybe you need to add a 'var' to the for loop, unless n is declared elsewhere
for( var n = 0 ; ....
<!doctype html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
var i=0;
function animateAds() {
if(i==9){return;}
$('#ad_2').fadeOut('fast',function(){
$('#ad_1').fadeIn('slow', function (){
$('#ad_1').delay(100).fadeOut('fast', function (){
$('#ad_2').fadeIn('slow', function(){i++;animateAds();});
});
});
});
};
$(document).ready(function() {
animateAds();
});
</script>
</head>
<body>
<img id='ad_1' style='display:none' src='http://sstatic.net/so/img/logo.png'>
<br>
<img id='ad_2' src='http://sstatic.net/so/img/logo.png'>
I'm not sure if this ideal, but it works as a self contained page. Is this what you're trying to do?
Your code shows a limit of 10, but your question sort of sounds like you want it to be perpetual.
Here's an example of how it would run perpetually. If you want the limit, then it would be a simple reworking of the if() statement in the callback.
$('document').ready(function() {
var elements = ['#ad_1','#ad_2'];
var i = 0;
var limit = elements.length;
function rotateAds() {
$(elements[i]).fadeIn(400);
$(elements[i]).delay(1000).fadeOut(200,function(){
i++;
if(i == limit) i = 0;
rotateAds();
})
}
rotateAds();
});
Does this seem close to what you were looking for?
You can add as many elements to the array as you wish, since it simply counts the length of the array.