Форум

annie88 · #1 (**permalink**) 20.10.2015, 13:30

Добрый день!
Не могли бы вы подсказать, из-за чего может происходить искажение периода показа элемента, в котором используется эффект fadeIn/fadeOut?

Я делала таким образом,

$('.class_2, .class_2').stop().delay(12000).fadeOut(5000,someFunction).fadeIn(5000);

Несколько циклов они скрываются/отображаются одновременно, но затем одна часть начинает опережать другую.

ksa · #2 (**permalink**) 20.10.2015, 13:52

Сообщение от annie88

Несколько циклов они скрываются/отображаются одновременно, но затем одна часть начинает опережать другую.

JS не является языком реального времени...

Цитата:

Производительность

Большое количество таймеров может привести к серьезной нагрузке на процессор.

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

http://javascript.ru/setTimeout

annie88 · #3 (**permalink**) 20.10.2015, 14:11

Спасибо за ответ, но не могли бы вы разъяснить мне еще такую вещь
конструкция

Сообщение от annie88

$('.class_2, .class_2').stop().delay(12000).fadeOut(5000,someFu nction).fadeIn(5000);

находится в функции, которая запускается по таймеру(он один).
Вообще там наблюдаются какие-то периоды "нормальности"/"ненормальности". Почему тогда анимация может выравниваться?

ksa · #4 (**permalink**) 20.10.2015, 14:15

Сообщение от annie88

конструкция

$('.class_2, .class_2').stop().delay(12000).fadeOut(5000,someFu nction).fadeIn(5000);

находится в функции, которая запускается по таймеру

Не важно как запускается твоя "конструкция"... Важно как она работает потом.

annie88 · #5 (**permalink**) 20.10.2015, 14:41

логично

Сообщение от ksa

Не важно как запускается твоя "конструкция"... Важно как она работает потом.

, а работает она плохо...
Эту проблему можно как-нибудь обойти?
Использовать один таймер для всей анимации не получится, потому что он и так один

ksa · #6 (**permalink**) 20.10.2015, 15:12

Сообщение от annie88

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

В том-то и дело, что не один. Потому-то у тебя и идет разнобой в отрисовке.

Хочешь все сделать синхронно - пиши анимацию сама в одном таймере.

annie88 · #7 (**permalink**) 20.10.2015, 15:36

Большое спасибо, я все поняла

.
Сейчас проверила и оказалось, что во время затухания, данные(меняются в функции), вместо одного раза сменяются 21

, отсюда все проблемы.

annie88 · #8 (**permalink**) 21.10.2015, 11:38

Доброе утро! Разрешите еще такой вопрос

, проблема возникла из-за того, что функция someFunction запускается несколько раз при такой конструкции:

Сообщение от ksa

$('.class_2, .class_2').stop().delay(12000).fadeOut(5000,someFunction).fadeIn(5000);

Что нужно сделать, чтобы она запускалась только один раз?

рони · #9 (**permalink**) 21.10.2015, 11:59

Сообщение от annie88

'.class_2, .class_2'

зачем масло масляное?

Сообщение от annie88

что функция someFunction запускается несколько раз при такой конструкции

проблема в другом месте

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div  {
     height: 100px;
     width: 100px;
      background-color: #D2B48C;
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
$(function(){
var n = 1;
function someFunction()
{
   $('.first').html(n++)
}
$('.class_2').stop().delay(12000).fadeOut(5000,someFunction).fadeIn(5000);
});


  </script>
</head>

<body>




<div class='first'>

</div>
<div class="class_2">
</div>


</body>

</html>

annie88 · #10 (**permalink**) 21.10.2015, 12:45

Сообщение от рони

Сообщение от annie88
'.class_2, .class_2'
зачем масло масляное?

я не знаю как это обойти. У меня объекты с этими классами должны исчезать и появляться одновременно.

Сообщение от рони

проблема в другом месте

я не совсем понимаю, что вы хотите сказать.

Форум

Справочник

Discord чат

Курсы javascript