синхронизированное отображение div

Question

все, что мне нужно, это некоторый код на стороне клиента jQuery или JS, который изменит стиль divs после X секунд

как visibility : hidden; ИЛИ max-height : 50px;

или переключить класс \ id DIV ( предпочтительно )

Answer 1

Использовать setTimeout

setTimeout(function(){
  // Change the style here... If using jQuery, it turns
  $('#my_divs').css({'visibility':'hidden', 'max-height':'50px'})
  // or
  $('#my_divs').addClass('my-custom-class');
}, x_seconds);

Answer 2

Простое решение JavaScript:

setTimeout(function() {
  document.getElementById('your_div_id').className = 'new_class_name';
}, X * 1000); // X = number of seconds

Answer 3

$(document).ready(function(){
    setTimeout('changeStyle()', 1000); //milliseconds
});

function changeStyle() {
    //do something useful
}

Answer 4

Вот один метод, который я использую на текущем производственном веб-сайте.

$("#divStampWrapper").delay(1500).fadeIn("fast").delay(2500).animate({ top: -250 }, 2500).delay(2500).fadeOut("slow");

Объяснение: По сути, он захватывает div, который содержит изображение, ждет 1,5 секунды, а затем начинает постепенно отображать его для просмотра.Как только эффект затухания закончен, он ждет еще 2,5 секунды и начинает перемещать его вверх в новую верхнюю позицию.Затем он ждет еще 2,5 секунды и начинает исчезать.Я знаю, что это немного больше, чем вы просили, но это хороший пример того, что можно сделать с помощью таймера.

Answer 5

Если вы хотите показывать время через несколько секунд снова и снова, затем используйте

setIntervel('changeStyle()',1000);

, и вы просто хотите использовать время только один раз, затем используйте

setTimeout('changeStyle()',1000);
function changeStyle() {
 // code to display time
}