Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail


Донат для форума - использовать для поднятия настроения себе и модераторам

А ещё здесь можно купить рекламу за 25 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru

Ответ
 
Опции темы
Старый 08.02.2019, 23:40   #1
begovik
Пользователь
 
Аватар для begovik
 
Регистрация: 08.03.2010
Адрес: Украина,Артёмовск
Сообщений: 33
Репутация: 10

skype: begovik500
По умолчанию Код выполняется "не по порядку"

Здравствуйте.
У меня простой код, который должен делать картинку невидимой, менять ссылку на картинку и делать уже другую картинку видимой.
Но код сначала меняет ссылку, а потом скрывает и показывает замененную картинку. Подскажите, в чём дело...
Код:
$("nav").on("click", "div", function () {
   $(".photo img").fadeTo(400, 0);
   $(this).addClass("current").siblings().removeClass("current");
   $(".photo img").attr("src", $(this).attr("link"));
   $(".photo img").fadeTo(400, 1);
   return false;
})
Спасибо.
begovik вне форума   Ответить с цитированием
Старый 09.02.2019, 01:26   #2
Naive
Раздолбайских Дел
Профессионал
 
Аватар для Naive
 
Регистрация: 22.05.2009
Адрес: Екатеринбург
Сообщений: 3,813
Репутация: 2361
По умолчанию

Потому что анимация — это асинхронная операция. Она не будет блокировать синхронные действия.
Почитай доку jQuery, у них для любой анимации есть колбэк, который выполнится по её завершении.
Если вкратце: .fadeTo, (он же сокращение для .animate, но без указания точной функции преобразования), говорит как бы: "смотри, вот тебе 400 миллисекунд, сделай мне за них из `этого` — `это`", и jQuery запускает рекурсивную серию setTimeout, которые осуществляют изменение параметров раз в ~20мс. (я это знаю, потому что сам переписывал jQ.animate на более прогрессивный requestAnimationFrame)
Любой асинхронный таймаут ставит выполнение своей функции (колбэка) в асинхронную очередь на определенный промежуток времени. И пока до очереди этого промежутка не дойдет очередь (делаешь сеттаймаут с алертом, а после него while(1)), он не запустится (с while(1) alert не сработает никогда). синхронное выполнение программы заблокирует все ресурсы браузера.
Один из банальнейших вопросов на собеседованиях уже лет 10:
Код:
for (var i = 0; i < 5; i++) {
  setTimeout(function(){
    console.log(i);
  },0)
}
что выведет браузер и почему.
Почитай про асинхронку, посмотри лекции ШРИ Яндекса, учебник Ильи Кантора.
__________________
Работаю. В этот раз за деньги.
Жду ваши искренние спасибы на яндекс-кошелек: 410011068154587
Naive вне форума   Ответить с цитированием
Старый 09.02.2019, 02:37   #3
begovik
Пользователь
 
Аватар для begovik
 
Регистрация: 08.03.2010
Адрес: Украина,Артёмовск
Сообщений: 33
Репутация: 10

skype: begovik500
По умолчанию

А-хах! Спасибо, Naive, ты настоящий программер, дал ответ на поставленный вопрос) (я без сарказма).
Но как же переделать код, чтоб он выполнялся по задуманному алгоритму, я это имел в виду, создавая тему?
Я понемногу развиваюсь, в изучении JS, и когда-нибудь дойду до понимания этих глубин, но сейчас мне просто нужно чтоб код выполнил то, что я задумал.

P.S.
В выражениях jQ.animate и requestAnimationFrame я понимаю только то, что они оба работают с анимацией.
begovik вне форума   Ответить с цитированием
Старый 09.02.2019, 08:18   #4
p51x
Профессионал
 
Регистрация: 15.02.2010
Сообщений: 14,908
Репутация: 2668
По умолчанию

Так вам же написали - добавьте код, который должен выполняться после анимации в коллбек для fadeTo.
__________________
Запомните раз и навсегда: помочь != "решите за меня"!
p51x на форуме   Ответить с цитированием
Старый 09.02.2019, 14:24   #5
begovik
Пользователь
 
Аватар для begovik
 
Регистрация: 08.03.2010
Адрес: Украина,Артёмовск
Сообщений: 33
Репутация: 10

skype: begovik500
По умолчанию

А, понятно, я не знал, что для него можно дописывать третий параметр.
Спасибо ребят, всё получилось.
begovik вне форума   Ответить с цитированием
Ответ

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Убрать папки "Pictures", "Music", "Видео", "Downloads" из "МОЙ КОМПЬЮТЕР" Бахтиёр1916 Windows 1 05.04.2017 13:53
Нужно пояснить/прокомментировать код программы, или коды функций "Добавить" "Удалить" "Обновить(редактировать" "Поиск" "Период") ZIRASS PHP 4 15.06.2016 15:23
Создать класс "Вентилятор" содержащий в себе классы: "Двигатель", "Контроллер", "Пульт управления" link90 Общие вопросы C/C++ 2 27.03.2016 13:34


22:50.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.