Подкачка setTimeout to setinterval, может ли кто-нибудь помочь мне решить эту проблему?

Question

Im в настоящее время посередине строительных тестовых сайтов, чтобы помочь мне понять кодировку больше и попытаться лучше понять, как все это происходит.

Моя проблема заключается в следующем: У меня есть раздел сайта с несколькими цитатами, они исчезают, затем выходят из поля зрения, раскрывая новую цитату. Это было, я сделал ошибку. Я настроил его так, чтобы он прокручивал все кавычки ... но потом остановился. Я хотел бы, чтобы они повторили. Я знаю, что моя ошибка заключается в использовании функции the.setTimeout вместо кода setInterval.

Мой вопрос заключается в следующем, есть простое решение для замены кода Его взял меня хороший, а просто, чтобы обернуть мою голову вокруг этого лол

Вот код для вас смотреть. Любая помощь будет принята с благодарностью.

$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_1").slideUp(800); 
    }, 4000); 
}); 
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_2").fadeIn(400); 
    }, 4800); 
}); 
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_2").slideUp(800); 
    }, 8000); 
}); 
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_3").fadeIn(400); 
    }, 8800); 
});  
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_3").slideUp(800); 
    }, 12000); 
}); 
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_4").fadeIn(400); 
    }, 12800); 
}); 
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_4").slideUp(800); 
    }, 16000); 
}); 
$(function(){ 
setTimeout(function() 
    { 
    $("#jobs_1").fadeIn(400); 
    }, 16800); 


});  

Большое спасибо

Answer 1

Вы можете переместить все ваши имена блоков в стек и использовать одну единственную функцию:

var blocks = ['jobs_1', 'jobs_2', 'jobs_3', 'jobs_4']; 
var curentBlockIndex = 0; 
setInterval(function(){ 
    var nextBlockIndex = curentBlockIndex + 1; 
    if (nextBlockIndex >= blocks.length) nextBlockIndex = 0; 
    $('#' + blocks[curentBlockIndex]).slideUp(800, function(){ 
     $('#' + blocks[nextBlockIndex]).fadeIn(400); 
    }); 

    curentBlockIndex = nextBlockIndex; 
}, 4000); 

Answer 2

Это должно помочь вам. Как это работает? Вы устанавливаете текущий счетчик заданий равным 0. Затем, используя setInterval, каждые 3 секунды вы запускаете основную функцию, которая увеличивает счетчик заданий. Если счетчик превышает 4 (ваше последнее задание), скройте задание 4 и затушите его первым. В противном случае выведите предыдущее задание и затухайте в новом.

$(function(){ 
    count = 1; 

    x = setInterval(function(){ 
     count++; 
     if(count > 4) { 
      $('jobs_4').hide(function(){ 
       $('#jobs_1').fadeIn(); 
      }); 

      count = 1 
     } else { 
      $('#jobs_' + (count-1)).slideUp(function(){ 
       $('#jobs_' + (count-1)).fadeIn(); 
      }); 
     } 

    }, 3000); 
}