Чтение значений CSS3 с помощью jQuery

Question

Есть ли способ прочитать значения CSS3 с помощью jQuery? Я пытался просто использовать:

var test = $("#container").css("transition") // there, normal selector.

но я получаю "ноль" в качестве значения, хотя на самом деле оно margin-left .5s. Если я попробую -webkit-transition вместо transition (поскольку я тестирую в Chrome), это не даст мне никакого значения.

Если пока нет способа сделать это, все в порядке, но я подумал, что это работает, спрашивая. Может быть, есть плагин или что-то, что я могу использовать для этого? В основном мне нужно изменить transition после определенного количества слайдов, а затем вернуть его обратно.

Answer 1

transition является сокращенным свойством;transition-property, transition-duration, transition-timing-function и transition-delay.

jQuery's .css не поддерживает получение значений сокращенных свойств CSS, поэтому вы должны получить каждый компонентчасти отдельно.

Что-то вроде

$('#container').css('-webkit-transition-property')

даст вам, например, только часть margin-left.

Answer 2

Работает ли обычный JS?

document.getElementById('container').style.webkitTransition
// or
getComputedStyle(document.getElementById('container')).webkitTransition

(работает он или нет, он более чем в 500 раз эффективнее jQuery)