Nierozpoznana funkcja

Hej

mam kłopot z jQuery, na początku skryptu wstawiam :

        <script type="text/javascript">
            $(function(){
                var $container = $('#container');
                $container.imagesLoaded(function(){
                $container.masonry({
                    itemSelector : '.box',
                    columnWidth : 240
                });
                }); 
         </script>

a otrzymuje błąd o następującej treści, co się dzieje : TypeError: $container.imagesLoaded is not a function

z tego co pamiętam, to zmienne w js nie mają $ na początku... wczytałeś wcześniej plugin dodający tą funkcję?

z tego co pamiętam, to zmienne w js nie mają $ na początku...

No tak, bo przecież $ z jQuery nie zaczyna się od $.

@ andreas12:
Potrzebujesz tego pluginu:
http://desandro.github.com/imagesloaded/
NIE skopiować (i ew. przerobić) przykład, ale też dołączyć bibliotekę dokładając kolejny tak <script> w HTML, najlepiej zaraz po <script> który ładuje jQuery.

ok, dzięki, teraz jest GIT ! Mam jeszcze jedno pytanie, czy ktoś korzystał kiedyś z tego linku : http://www.jquery4u.com/tutorials/jquery-infinite-scrolling-demos/#.UGMVGmY-QWM

Płytki ułożone są ok, ale brak doładowania nowych płytek przy ruchu scrollem, brak w ogóle jakiejkolwiek reakcji, może ktoś coś wie na ten temat ?
Z prostego przykładu na podanej stronie, nie działa jak powinno.

przepraszam ! zapomniałem dopisać, że chodzi o DEMO 1

... jakoś sobie poradziłem, ale mam uciążliwy mały problem w szczególe, otóż moje płytki mają stałą szerokość, a różną wysokość w zależności od obrazka, gdy pobieram owe dane i doczytuje nowe płytki, na niektórych dochodzi do nakładania się na poprzednią, nie wiem czemu tak się dzieje.

Tak wygląda mój skrypt :

            <script type="text/javascript">                  
                $(document).ready(function() { 
                        $container.imagesLoaded(function() {
                            $container.masonry({
                                    itemSelector : ".box",
                                    columnWidth : 25,
                                    gutterWidth : 100
                            });
                        })
                            
                        $(window).scroll(function() {    
                            if ($(window).scrollTop() == $(document).height() - $(window).height()) {                         
                                    $('div#loadmoreajaxloader').show();
                                    $.ajax ({                                
                                        url: 'newdata.php',
                                        data : ({ 
                                            myboxid  : $(".box:last").attr('id')
                                        }),                                
                                        success: function(html) { 
                                            var parsehtml = $.trim(html);
                                            if (parsehtml) {
                                                var $container = $("#container");                        
                                                $container.append(parsehtml);
                                                $container.masonry('reload');
                                                
                                                $('div#loadmoreajaxloader').hide();
                                            } else {
                                                $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
                                            }                                                                            
                                        },
                                    });                                                                                                                 
                            }                                                                        
                        });
                });             
            </script>    

w HTML oczywiście standard :

<div id='containter'>
    <div id='1' class='box'>...</div>
    <div id='2' class='box'>...</div>
    <div id='3' class='box'>...</div>
    <div id='4' class='box'>...</div>
</div>

Witam ponownie

problem w tym, że u mnie kodzie nie działam na jednej głównej stronie, jak poniżej, wtedy wszystko ładnie działa :

http://www.jquery4u.com/demos/infinite-scrolling-demo2/

Gdy w kontrolerze w danej metodzie użyję :

$this->renderPartial('index'); 

wówczas doczytywane są kolejne płytki ale niektóre z nich się nakładają na siebie, gdy zaś zrobię, tak :

$this->render('index'); 

wówczas ładowanie trwa o wiele dłużej, ładuje wszystko wraz z nagłółwkami itd. ale działa. U mnie wszystkie nagłówki, skrypty wejściowe, linki znajdują się w osobnym pliku glowny.php a index.php jest niżej w hierarchii.