Отображение -webkit-transition с использованием jQuery css

Question

Отображение -webkit-transition с использованием jQuery css

0

у меня есть

<div id="content"></div>

Я использую jQuery для стилизации

$('#content').css({'width': '10%', '-webkit-transition': '1s all'});

Как я могу сделать работу -webkit-transition с помощью jQuery css

user544079 23 май 2014, в 20:19

Источник

0

Вы пытаетесь настроить таргетинг только на браузеры на основе Webkit? Какой вы используете? Вам также нужно будет установить исходную ширину #content, чтобы он знал, с чего переходить.
Sunny Patel 23 май 2014, в 17:49
0

$ ('# content'). animate ({width: "10%"});
user3520434 23 май 2014, в 17:50

Теги:

jquery

css

css-transitions

1 ответ

Ещё вопросы

Вы пытаетесь настроить таргетинг только на браузеры на основе Webkit? Какой вы используете? Вам также нужно будет установить исходную ширину #content, чтобы он знал, с чего переходить.

Mr. Alien · Answer 1 · 2014-05-23T16-44-00.000Z

Из MDN:

Формальный синтаксис: [none | <single-transition-property> ] || <time> || <timing-function> || <time>

Обратите внимание, что порядок важен в элементах этого свойства: первое значение, которое может быть проанализировано как время, назначается transition-duration, а второе значение, которое может анализироваться как время, назначается transition-delay.

Таким образом, ваш синтаксис неверен, он должен быть all 1s одним, но я не уверен, почему вы делаете это с помощью jQuery, когда вы можете добиться этого с помощью чистого CSS.

$('#content').css({'width': '10%', '-webkit-transition': 'all 1s'});
                                                        ---^---

Разработчики используют jQuery, чтобы заполнить пробел в проблемах с перекрестными браузерами, здесь вы используете специфическое свойство браузера, и это тоже с jQuery, не имеет смысла.

Если вы хотите сделать чистый CSS, используйте

#content {
    -webkit-transition: all 1s;
    transition: all 1s;
}