jQuery: Comment puis-je FONDU une liste de divs moins fréquemment utilisés, et fade-in sur mouseover?

Question

Disons que vous avez un tas d'éléments sur une page Web que vous n'utilisez pas beaucoup, comment peut jQuery les estomper un peu, mais seulement quand il n'y a pas mouseover? Il doit aussi estomper le passage de la souris!

Answer 1

Je l'ai résolu comme ceci:

//list the items you want to fade out in normal selector format
var arr = [ "#navTop","#banner","#idViewToolbar","#fbsidebar","#idActionP","table.noBorder" ];


//delay function by Clint Helfers
$.fn.delay = function( time, name ) {

    return this.queue( ( name || "fx" ), function() {
        var self = this;
        setTimeout(function() { $.dequeue(self); } , time );
    } );

};

$.each( arr, function(i, l){
   jQuery(l).fadeTo(600, 0.10);
   jQuery(l).mouseenter(function(){
        jQuery(this).fadeTo(600, 1);
    });

       jQuery(l).mouseleave(function(){
        jQuery(this).delay(5000).fadeTo(600, 0.10);
    });

 });

En fait, je l'utilisais pour FogBugz - ils ont un plugin qui vous permet d'insérer votre propre CSS + Javascript dans la page, je l'utilise pour faire disparaître la plupart des choses, mais la liste bug / fonctionnalité Je travaille sur

Answer 2

si vous ne avez pas besoin les trucs d'animation, vous pouvez le faire avec css pur en utilisant le sélecteur de psoudo de :hover mais il y a aussi une méthode .hover() dans jquery, il vous aidera à atteindre cet effet. quelque chose comme ceci: $('.my_less_used_divs').hover(fadeInFunction, fadeOutFunction);

Answer 3

Pour mettre réellement ce antpaw recommandé dans le code. Procédez comme suit.

$(".my_less_used_divs").hover(function() {
    $(this).css("opacity", 1);
}, function() {
    $(this).css("opacity", .5);
}).css("opacity", .5);

Vous devez donner antpaw la réponse acceptée si vous aimez cela.

Answer 4

$(".divfade").hover(function() {
    $(this).fadeTo("slow", 1);
}, function() {
    $(this).fadeTo("slow" , .5);
}).css("opacity", .5);

Ce code ne se fanent et fade out.