динамично измените анимацию WebKit с JavaScript
Я хотел бы использовать анимацию WebKit с - ключевые кадры WebKit, но способность динамично изменить значения на правиле, так, чтобы анимация не была статична. Все образцы я нашел использование помехами - кадры WebKit, там способ настроить с JavaScript?
2 ответа
Хотелось бы мне поверить в это, но вот ссылка на кого-то, кому удалось изменить существующую анимацию, а не создать новую.
Я проверил это, чтобы убедиться, что это действительно работает.
РЕДАКТИРОВАТЬ
Итак, эта ссылка мертва, и я больше не доверяю Gitorious поддерживать URL-адреса, поэтому вот ссылка на JSFiddle, которую я создал, чтобы ответить на аналогичный вопрос: http://jsfiddle.net/russelluresti / RHhBz / 3 /
Содержит скрипт для поиска существующей анимации, обновления ее значений и назначения его элементу, чтобы анимация происходила. Я тестировал это в Chrome 18 и Safari 5.1
Мне пришлось создать новое правило стиля в загруженных таблицах стилей. Кажется, отлично работает в бета-версии Chrome 5.0.342.9 (по крайней мере)
var lastSheet = document.styleSheets[document.styleSheets.length - 1];
lastSheet.insertRule("@-webkit-keyframes " + newName + " { from { top: 0px; } to {top: " + newHeight + "px;} }", lastSheet.cssRules.length);
, а затем назначьте имя анимации с помощью element.style
element.style.webkitAnimationName = newName;