Анимация свойства css через jquery

@sonntagausgang · Регистрация: 24.05.2013

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

У меня есть картинка, которая должна сначала увеличиться, потом чуть уменьшиться и опять увеличиться.
Увеличение я написал. А вот вызвать другую функцию, которая пошла бы сразу после выполнения предыдущей.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$('.content').animate(
    {
        scale: 1.5,
        scale1: 0.8
    }, {    
        duration: 400,
        step: function( now, fx ){
            $(this).css('-webkit-transform','scale('+now+')');
        },
        step: function( now2, fx ){
            $(this).css('-webkit-transform','scale('+now2+')');
        },
            
    });

Так и неразобрался в значениях complete, queue, step.

Помогите пожалуйста разобраться.

Добавлено через 9 часов 21 минуту
че никто не знает как делать чтоли?

@zlobo · 02.12.2013, 13:04

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$('.content').animate({scale: 1.5}, {
   duration: 400,
   step: function( now, fx ){
      $(this).css('-webkit-transform','scale('+now+')');
   },
   complete: function(){
      $(this).animate({scale: 0.8}, {
         duration: 400,
         step: function( now, fx ){
            $(this).css('-webkit-transform','scale('+now+')');
         }
      });
   }
});

@sonntagausgang · 03.12.2013, 00:46 **[ТС]**

zlobo, спасибо. Наконец-то я понял как это работе.

Добавлено через 4 часа 56 минут
Ладно с этим разобрался. Теперь другая проблема. Я вообще делаю часы. У меня есть часовая стрелка, которая изначально повернута на 10 с помощью css. Центр поворота смещен на нижнюю границу стрелки.

CSS
1
2
-webkit-transform: rotate(-45deg); 
-webkit-transform-origin:center 195px;

Я хочу сделать чтобы она поворачивалась по анимации на 45 градусов в другую сторону.
Работает, только как-то неправильно. Поначалу стрелка стоит, как я и говорил на 10, как только начинается анимация, стрелка вместо того чтобы повернуться на 45 градусов, как вам объяснить становиться на 12 часов и только потом поворачивается на 45 градусов.

У меня нет просто слов. Такого я не ожидал.

JavaScript
1
2
3
4
5
6
$('.circle1 ').animate({rotate:45}, {
                            duration: 5000,
                            step: function( now, fx ) {
                                $(this).css('-webkit-transform', 'rotate('+now+'deg)');
                            },
                        });

Добавлено через 16 минут
Может приписывать поворот на начальный угол в 45 градусов непосредственное там где анимация (ну до нее)

Новые блоги и статьи Все статьи Все блоги /
Автоматическое создание документа при проведении другого документа Maks 29.03.2026 Реализация из решения ниже выполнена на нетиповых документах, разработанных в конфигурации КА2. Есть нетиповой документ "ЗаявкаНаРемонтСпецтехники" и нетиповой документ "ПланированиеСпецтехники". В. . .	Настройка движения справочника по регистру сведений Maks 29.03.2026 Решение ниже реализовано на примере нетипового справочника "ТарифыМобильнойСвязи" разработанного в конфигурации КА2, с целью учета корпоративной мобильной связи в коммерческом предприятии. . . .	Автозаполнение реквизита при выборе элемента справочника Maks 27.03.2026 Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. При выборе "Спецтехники" (Тип Справочник. Спецтехника), заполняется. . .	Сумматор с применением элементов трёх состояний. Hrethgir 26.03.2026 Тут. https:/ / fips. ru/ EGD/ ab3c85c8-836d-4866-871b-c2f0c5d77fbc Первый документ красиво выглядит, но без схемы. Это конечно не даёт никаких плюсов автору, но тем не менее. . . всё может быть. . .
Автозаполнение реквизитов при создании документа Maks 26.03.2026 Программный код из решения ниже размещается в модуле объекта документа, в процедуре "ПриСозданииНаСервере". Алгоритм проверки заполнения реализован для исключения перезаписи значения реквизита,. . .	Команды формы и диалоговое окно Maks 26.03.2026 1. Команда формы "ЗаполнитьЗапчасти". Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. В качестве источника данных. . .	Кому нужен AOT? DevAlt 26.03.2026 Решил сделать простой ланчер Написал заготовку: dotnet new console --aot -o UrlHandler var items = args. Split(":"); var tag = items; var id = items; var executable = args;. . .	Отправка уведомления на почту при создании или изменении элементов справочника Maks 24.03.2026 Программная отправка письма электронной почты на примере типового справочника "Склады" в конфигурации БП3. Перед реализацией необходимо выполнить настройку системной учетной записи электронной. . .