koniec jquery fadeIn () ma „bump” w Chrome

Używam bardzo prostego fadeIn i fadeOut w Chrome. Chcę tylko, aby jeden element tekstowy zanikał, a drugi zanikał. Przykład pracy:http://jsfiddle.net/forgetcolor/7eR5Q/

Mam problem z tym, że na końcu fadeIn () następuje gwałtowne przejście do stanu końcowego. Nazywam to „uderzeniem”. Element wygładza się płynnie, ale na końcu traci tę gładkość i kończy zanikanie naraz.

Czy istnieje sposób, aby tego uniknąć?

var cur = 1;
$('#btn').click(function() {

    if (cur == 1) {
        $('#txt1').fadeOut(500, function() {
            $('#txt2').fadeIn(500);
        });
        cur = 2;
    } else if (cur == 2) {
        $('#txt2').fadeOut(500, function() {
            $('#txt1').fadeIn(500);
        });
        cur = 1;
    }
});​

body {
    background-color:#666;
    color:white;
    font-size:20px;
    margin:20px;
}
#txt2 {display:none;}​

<div id="txt1">txt1</div>
<div id="txt2">txt2</div>
<br/><div id="btn">btn</div>​

AKTUALIZACJA:

Oto film:http://www.youtube.com/watch?v=n2IGED0pkVg

Mój numer wersji Chrome to 20.0.1132.21 beta (najnowszy teraz) w OSX

Wysłano raport o błędzie Chrome:https://code.google.com/p/chromium/issues/detail?id=130801

questionAnswers(4)

yourAnswerToTheQuestion