Скрыть и показать цикл с помощью setInterval - PullRequest
Новая
       12

Скрыть и показать цикл с помощью setInterval

1 голос
/ 04 января 2012

У меня есть анимация GIF, которая будет зацикливаться вечно. Однако я не хочу, чтобы он был виден постоянно, поэтому в основном мне нужно дать анимации 3 секунды для запуска один раз, затем спрятать ее и через 10 секунд снова сделать ее видимой на 3 секунды.

У меня сейчас есть это, но оно не работает: 

<script type="text/javascript">

    function autoupdate() {

  $('#bird').delay(3000);
  $('#bird').css('display', 'none'):
  $('#bird').delay(10000);
  $('#bird').css('display', 'block');
  }

  $(document).ready(function() {
    setInterval("autoupdate()", 50);
  }); 
  </script>

Ответы [ 2 ]

3 голосов
/ 04 января 2012

Удалить ()

  $(document).ready(function() {
    setInterval(autoupdate, 50);
  });

Побочный момент: .delay(..) в вашем коде ничего не сделает .... Это не то, что он намеревался.

Попробуйте вместо этого: 

function autoupdate() {
  setTimeout(function(){
     $('#bird').css('display', 'none');
     setTimeout(function(){
        $('#bird').css('display', 'block');
        setTimeout(autoupdate, 50);
     }, 10000)
  }, 3000)
}

$(function(){ //same as $(document).ready(function(){
   setTimeout(autoupdate, 50);
});

Скрипка: http://jsfiddle.net/maniator/NYkCr/

1 голос
/ 04 января 2012

В решении Нила есть ошибка, поскольку она будет скрыта в течение 13 секунд, а не 10 Я думаю, что следующее подойдет вам лучше, и оно не содержит этих 50 миллиард обходных путей.

Вот моя скрипка 

<div id="bird">
    bird
</div>
<script>
     function autoupdate() {

  $('#bird').css('display', 'none');
  setTimeout(function(){$('#bird').css('display', 'block')},10000);
  setTimeout(autoupdate,13000);

  }

 setTimeout(autoupdate,3000);
</script>
...