Мне было интересно, есть ли способ, используя jQuery, анимированные свойства текстового тени, такие как размер или цвет.
Это раздражает, что нет отдельных свойств, таких как text-shadow-color вместо того, чтобы оператор был доступен только в комбинированной форме.
Возможно, будет немного поздно для этого ответа, но здесь все равно...
Я решил это, реализовав "виртуальное" css-свойство, которое будет анимировано как
$.fx.step.textShadowBlur = function(fx) {
$(fx.elem).css({textShadow: '0 0 ' + Math.floor(fx.now) + 'px black'});
};
$(el).css({textShadowBlur:20})
.animate({textShadowBlur:1}, {duration: 1000});
Это описано более подробно здесь: http://usefulthink.com/2010-12/animating-text-shadow-using-jquery
Некоторые другие подходы можно найти здесь: http://forum.jquery.com/topic/let-s-animate-text-shadow
В качестве альтернативы использованию jQuery вы можете использовать мощные возможности анимации UIZE JavaScript Framework. См. Различные элементы нескольких текстовых теней, которые анимируются одновременно в следующем примере...
http://www.uize.com/examples/hover-fader-text-shadow-animation.html
Единственный способ, которым я действительно работал, - создать <span> с тем же текстом, что и <a>, и наложить его, используя абсолютное позиционирование, отрицательные поля и .fadeIn()/. fadeOut() или непрозрачность анимации. Но даже это было глючит в лучшем случае из-за всех "на ходу" расширения элементов, а наложение было "отвлечено", смотря в лучшем случае.
Почему бы не использовать addClass ('shadow') и добавить переход к элементу?
Конечно, это не работает в старом IE...
Используйте javascript для анализа свойства CSS и создания нового
var myelement_shadow = $('myelement').css('text-shadow');
предоставит вам свойство
Используйте javascript String для работы с ним: http://www.w3schools.com/jsref/jsref_obj_string.asp и parsefloat ('2px') даст вам только 2