Plugin jQuery "Isotope" - Problème position

Bonjour à tous !

Voilà 2 semaines que je m'acharne sur ce bout de code, donc je me décide à en appeler à votre aide.

Je veux réaliser un mur de photos sur mon site internet. J'affiche donc des vignettes de tailles diverses, présentes dans un dossier, le reste des infos se trouvant dans une BDD. Voilà l'affichage en HTML :

<section id="contain">  
                    
                    <?php 
                   
                   try
                        {
                            $bdd = new PDO('mysql:host=localhost;dbname=yakatofe', 'root', '');
                        }  
                        catch (Exception $e)
                        {
                        die('Erreur : ' . $e->getMessage());
                        }

                    $req = $bdd->query('SELECT * FROM photos ORDER BY id DESC LIMIT 0, 45');

                    while ($donnees = $req->fetch())
                    {

                    ?>

    <a class="link_fancybox" rel="gallery" href="photos/full/<?php echo htmlspecialchars($donnees['filename']) ?>" title="<?php echo htmlspecialchars($donnees['title']) ?>" legende="<?php echo htmlspecialchars($donnees['description']) ?>"><img src="photos/thumbs/thumb_<?php echo htmlspecialchars($donnees['filename']) ?>" class="item" id="<?php echo htmlspecialchars($donnees['id']) ?>"/></a>
                    <?php
                    } // Fin de la boucle
                    
                    $req->closeCursor();
                    ?>

    
    
    </section>

Pour un affichage un peu amélioré par rapport à un float : left; j'utilise donc le plugin isotope que j'appelle ainsi :

<script type="text/javascript">
$(document).ready(function(){
    $('#contain').imagesLoaded(function(){$('#contain').isotope({
  // options
  itemSelector : '.item',
  layoutMode : 'masonry',
   masonry: {
    columnWidth: 60
  }
}); }); });
</script>

Jusque là tout va bien, mais c'est ensuite que ça se gâte. En effet, pour afficher davantage de photos, j'utilise un infinite scroll que j'ai codé ainsi :

<script type="text/javascript" src="js/jquery.timers.js"></script>
<script type="text/javascript">
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height()){
$('div#ajaxloader').show();
$.ajax({
url: "loadcontent.php?lastid=" + $(".item:last").attr("id"),
success: function(html){
if(html){
var $newselements = jQuery(html);
jQuery("#contain").append($newselements).isotope( 'appended', $newselements, callback );
$('div#ajaxloader').hide();
}else{
$('div#ajaxloader').hide();
}
}
});
}
});
</script>

Et là, c'est le drame ! Malgré tout mes efforts, il y a toujours un problème avec l'affichage. Ici, avec cette dernière version que je vous présente, les nouvelles photos s'organisent comme il faut entre elle, mais elle se mettent tout en haut de la <section>, et derrière les photos déjà présentes.

Voilà, j'aimerais un peu votre avis, parce que je commence à être à bout de solutions.
Merci d'avance