Ich möchte eine Div durch eine andere ersetzen, wenn ich darüber schwebe. Insbesondere wird es einen Durchschnitt in Wörtern geben, wie "Kämpfen" oder "Erwartungen übertreffen", und ich möchte diesen durch den numerischen Durchschnitt ersetzen, wenn der Benutzer über dem Durchschnitt in Wörtern schwebt.

#html

<div class="switch avg_words float_left">
  A+ (hover to see score)  
</div>
<div class="avg_num">
  AVG = 98.35%
</div>

#css

.avg_num {
display: none;
}

#jquery

$('.switch').hover(function() {
    $(this).closest('.avg_words').hide();
    $(this).next('div').closest('.avg_num').show();
}, function() {
    $(this).next('div').closest('.avg_num').hide();
    $(this).closest('.avg_words').show();
});

Es ist einfach genug, das erste Div auszublenden und durch das zweite zu ersetzen, aber das Problem ist, dass der Code die Dinge wieder auf den Normalwert zurückstellt, wenn der Schwebeflug endet. Jetzt schweben diedivs blinken nur hin und her.

http://jsfiddle.net/uXeg2/1/