Animation der Deckkraft beim Hover-Effekt (jQuery)

Question

Wir haben einen Link:

    Etwas Text

Und wir möchten die Opazität des mit einer Animation ändern, wenn der Link angeklickt wird.

Wie würden wir das machen?

Answer 1

Eine weitere mögliche Lösung:

$("a span").hover(function(){
    $(this).stop().animate({"opacity": 1});
},function(){
    $(this).stop().animate({"opacity": 0});
});

Wenn Sie fadeOut() verwenden, wird der Span zusammenbrechen, auf diese Weise wird er nicht

BEARBEITEN

Dies ist viel besser:

$('a:has(span)').hover(function() { 
    $('span', this).stop().animate({"opacity": 1}); 
},function() { 
    $('span', this).stop().animate({"opacity": 0}); 
});

Answer 2

So:

$('a:has(span)').hover(
    function() { $('span', this).fadeIn(); },
    function() { $('span', this).fadeOut(); }
);

Answer 3

Verwenden Sie .fadeTo():

$( 'a' ).hover(
    function() { $( this ).fadeTo( 'fast', '1'); },
    function() { $( this ).fadeTo( 'fast', '.4'); }
);

Demo: siehe fiddle