Показать и скрыть div (с некоторой задержкой), используя setInterval (бесконечный цикл) - PullRequest
Новая
       8

Показать и скрыть div (с некоторой задержкой), используя setInterval (бесконечный цикл)

0 голосов
/ 24 октября 2011

Если кто-нибудь может мне помочь, я хочу, чтобы этот процесс был на одной из моих страниц:

  • Задержка 60 с;
  • Показать мой div 1 в течение 20 секунд;
  • Задержка 60 с;
  • Показать мой div 2 в течение 20 секунд;
  • Задержка 60 с;
  • Показать мой div 1 в течение 20 секунд;
  • Задержка 60 с;
  • Показать мой div 2 в течение 20 секунд;
  • .
  • .
  • продолжайся вечно ...

Я пытался использовать это решение ! который я нашел в 'StockOverFlow', но у меня не работает правильно.

Спасибо

1 Ответ

1 голос
/ 24 октября 2011

Вот код, который сделает это:

HTML: 

<div id="block1"></div>
<div id="block2"></div>

Javascript: 

var shortIntervalTime = 2 * 1000;
var longIntervalTime = 5 * 1000;

function cycle(id) {
    var nextId = (id == "block1") ? "block2": "block1";
    $("#" + id)
        .delay(shortIntervalTime)
        .fadeIn(500)
        .delay(longIntervalTime)
        .fadeOut(500, function() {cycle(nextId)});
}

cycle("block1");

Вы можете установить интервал времени так, как вам нравится - я установил его здесь для демонстрационных целей. При этом используется последовательность эффектов jQuery, а затем по завершении последнего эффекта для данного объекта он снова начинает цикл для другого объекта и повторяется вечно.

Вы можете увидеть это здесь: http://jsfiddle.net/jfriend00/LTRzV/.

...