Не работает анимация

23.10.2017, 15:13. Показов 841. Ответов 0

Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам

Добрый день!

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
$(document).ready(function(){
 $('.mob_menu_btn i').click(function(){
  $('.nav_menu').css({'display':'block','opacity':'1'});
   $('.mob_menu').animate({right:0},600);
 
   $('.close_btn').click(function(){
    var widths = screen.width;
    $('.mob_menu').animate({right: '-'+widths},600,function(){
     $('.nav_menu').css({'opacity':'0','display':'none'});
    });
    
   });
 });

Событие при нажатии на .mob_menu_btn i работает отлично, но при '.close_btn' $('.nav_menu').css({'opacity':'0','displ ay':'none'}); визуально срабатывает раньше, чем закончится анимация. То есть я наживаю на .close_btn и блок просто исчезает. Может я не так скрипт написал?

Добавлено через 13 минут
Ребят, сделал уже без анимации

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$('.mob_menu_btn').click(function(){
        $('.nav_menu').css({'display':'block','opacity':'1'});
            $('.mob_menu').css('right','0');
 
            $('.close_btn').click(function(){
                var widths = screen.width;
                $.when(
                    $('.mob_menu').css('right','-100%'))
                .then (
                    $('.nav_menu').css({'opacity':'0','display':'none'})
                );
                
            });
    });

и блокам поставил

CSS
1
transition: all 1.3s ease;

Но все-равно не работает. входит и уходит моментально

Programming

Эксперт

39485 / 9562 / 3019

Регистрация: 12.04.2006

Сообщений: 41,671

Блог

23.10.2017, 15:13

Ответы с готовыми решениями:

Не работает анимация
Добрый день. работаю в редакторе Sublime Text 3. Создаю простейшую анимацию вращения квадрата. Создал 3 документа, прописал код,...

Не работает анимация
Почему не работает анимация когда ширина блока задается в процентах? width: 100%; transition: width 6s linear 0s;

Не работает анимация
Помогите прописать анимацию, что-бы мяч попал в кольцо from tkinter import* root = Tk() c =...

Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.

inter-admin

Эксперт

29715 / 6470 / 2152

Регистрация: 06.03.2009

Сообщений: 28,500

Блог

23.10.2017, 15:13

Помогаю со студенческими работами здесь

Не работает анимация
<html> <head> <script Language=JavaScript> function init() {var canvas = document.querySelector('canvas'); var ctx =...

Не работает анимация
Хай :senor: <div id="loading_body"><div id="loading"></div></div> #loading { background-color: rgba(255, 69,...

Не работает анимация
Сделал 2 анимации спокойствия(машина едет) и когда получаешь урон (чуть дергается) Я перепробовал много разных скриптов что-бы 2 анимация...

Не работает анимация
Хочу создать такую анимацию: сначало - один квадрат, а после из под него вылезают ещё 3 и они разбегаются в разные стороны, образую матрицу...

Не работает анимация
Добрый день. Хочу сделать прелоадер, но он почему-то не работает. Подскажите в чем проблема <div...

Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:

Новые блоги и статьи Все статьи Все блоги /
Знаешь почему 90% людей редко бывают счастливыми? kumehtar 14.04.2026 Потому что они ждут. Ждут выходных, ждут отпуска, ждут удачного момента. . . а удачный момент так и не приходит.	Фиксация колонок в отчете СКД Maks 14.04.2026 Фиксация колонок в СКД отчета типа Таблица. Задача: зафиксировать три левых колонки в отчете. Процедура ПриКомпоновкеРезультата(ДокументРезультат, ДанныеРасшифровки, СтандартнаяОбработка) / / . . .	Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .
Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .	Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .

Наверх