jQuery verblassen in / out mit der Maus darüber?

Question

Ich habe Links in der folgenden Struktur, und ich möchte wissen, was die jQuery / CSS sollte die <img /> Tags zu verstecken sein und verblassen sie mit der Maus darüber in.

Die Idee dabei ist, dass die HTML versteckt ist und blendet mit der Maus darüber eine glatte Wirkung zu erzielen.

Inzwischen ist ein CSS Hintergrund zeigt am Anfang.

HTML:

  

     

     

Link Text 1   

     

Link Text 2   

     

CSS:

#nav a span{
  display: none; /* Hide the text reader title */
}

#nav a {
  display: block;
  height: 200px;
  width: 250px;
  background url("bgimage.png"); /* I would ideally use the # selector for individual links.. */
}

#nav a img{
  /* what goes here so that jQuery works and so that we can backwards compatibility a:hover effect? */
}

jQuery:

???

Auf einer Seite zur Kenntnis, habe ich bemerkt, dass jQuery wird eine Animation mehrfach ausgeführt werden, wenn das Zielelement ein Kind Knoten ist, die ein paar Ebenen tief verschachtelt ist. Gibt es eine Möglichkeit, dies zu stoppen?

Answer 1

Nur eine style="display: none;" attr auf das Bild, html, hinzufügen und dann diese verwenden:

       $("#nav").hover(
            function() {
                $("img", this).show();
            },
            function() {
                $("img", this).hide();
            });

(Ändern Effekte für Ihre Bedürfnisse, wenn zeigen / verstecken ist nicht das, was Sie brauchen)