Отображение элемента страницы за заданный период времени

Question

быстрый вопрос. Я пытаюсь использовать либо javascript, jquery, либо php, чтобы сделать так, чтобы при нажатии на ссылку он заменял статическое изображение на моей странице другим изображением на 15 секунд, а затем возвращался к исходному изображению. Каков наилучший способ сделать это?

Answer 1

Вы можете сделать простой тайм-аут для этого:

$('#myLink').click(function() {
  $('#myImg').attr('src', 'newImg.jpg');
  setTimeout(function() { $('#myImg').attr('src', 'oldImg.jpg'); }, 15000);
});

В качестве альтернативы, если вы хотите постепенное исчезновение, сделайте другое изображение абсолютно позиционированным, как это:

<div>
 <img id="tempImg" src="tempImg.jpg" style="position:absolute; display:none; z-index: 2;" />
 <img src="oldImg.jpg" />
</div>

Тогда jQuery вот так:

$('#myLink').click(function() {
  $('#tempImg').fadeIn().delay(15000).fadeOut();
});

Убедитесь, что изображения имеют одинаковые размеры (для изображений это необязательно), временное изображение будет появляться поверх статического изображения, подождать 15 секунд, а затем исчезнет.