Animowane elementy tekstu-cienia z jQuery

Question

Zastanawiam się, czy istnieje sposób, aby za pomocą jQuery, animate właściwości tekstu-shadow, jak rozmiar lub kolor.

To denerwujące, że nie ma indywidualnych właściwości, takich jak text-shadow-color, zamiast instrukcji dostępnych tylko w postaci złożonej.

Answer 1

użyć JavaScript do analizowania właściwości CSS i stworzyć nowy

var myelement_shadow = $('myelement').css('text-shadow'); 

daje z obiektem

funkcje

użyć JavaScript Stringi z nim pracować: http://www.w3schools.com/jsref/jsref_obj_string.asp i parseFloat ('2px') dostarczy Ci tylko 2

Answer 2

Jako alternatywę dla używania jQuery, możesz korzystać z potężnych możliwości animacji UIZE JavaScript Framework. Zobacz różne elementy wielu cieni tekstowych są animowane w tym samym czasie w poniższym przykładzie ...

http://www.uize.com/examples/hover-fader-text-shadow-animation.html

Answer 3

Może być trochę za późno na to odpowiedź, ale tutaj jest tak ...

Rozwiązałem go poprzez wdrożenie „wirtualny” cSS-właściwość być animowane jak ten

$.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}); 

jest to opisane bardziej szczegółowo tutaj: http://usefulthink.com/2010-12/animating-text-shadow-using-jquery

niektórych innych metod można znaleźć tutaj: http://forum.jquery.com/topic/let-s-animate-text-shadow

Answer 4

Jedynym sposobem, znalazłem, że rzeczywiście przepracowanych było stworzenie <span> z tego samego tekstu jako <a> i nakładając go za pomocą pozycjonowania bezwzględnego, marginesy ujemne, a .fadeIn() /. fadeOut() lub animacje przezroczystości. Ale nawet to było w najlepszym wypadku kłopotliwe, ponieważ wszystkie elementy "w locie" rozszerzały się, a nakładka była w najlepszym wypadku "off".

Answer 5

Dlaczego nie używać programu addClass ("cień") i dodawać przejście do elementu?

Oczywiście to nie działa w starym IE ...