[Jquery] Callback czy też funkcje zwrotne

[Ellester6]

Mam taki problem, Mam 5 plakatów filmów ustawionych w rzędzie i przycisk którzy pokaże więcej w tym wypadku jeden dodatkowy.
Efekt który chciałem uzyskać to, powolne zanikanie 5 plakatów, po czym powolne wyświetlenie kolejnych, niestety ten plakat pokazuje się nagle a powinien powoli wschodzić.

http://st.pwsz.nysa.pl/~s17670/

Kod:

        $("#next").click(function(){
            $("#film1, #film2, #film3, #film4, #film5, #film6, #film7, #film8, #film9, #film10").animate(
                {
                opacity: 0.0,
                }, 1000,
                    function() {
                        $("#repertuar").html ('<img id="film6" src="FastandtheFurious6.jpg">');
                                $("#film1, #film2, #film3, #film4, #film5, #film6, #film7, #film8, #film9, #film10").animate(
                                    {
                                    opacity: 0.4,                
                                    }, 1000
                                );
                            }
                        
            );            
                
        });
                        
            );            
                
        });
                        
            );            
                
        });

[Kartofelek]

Zła logika.
Masz 6 filmów. Odpalasz dla każdego animate. No ok ujdzie (chociaż w twoim przypadku wszystkie znikną w tym samym momencie czyli lepiej animować kontener nadrzędny).
Potem zamiast wstawiać html masz wstawić 6 ukrytych elementów które zanimujesz do widoczności:

$film1 = $('<img src="......">').hide();
$film2 = $('<img src="......">').hide();
$('#repertuar').append($film1).append($film2).... //tutaj az prosi sie o tablice
$('#repertuar img[id^=film]').fadeIn();