Ich arbeite an einer Wordpress-Website, die David DeSandro jQuery Masonry Plugin zusammen mit Paul Irish Infinite Scroll-Plugin verwendet. Es gibt eine Callback-Option für das Infinite Scroll-Plugin, um Mauerwerk aufzurufen. Mauerwerk hat zwei Beispiele für diese Funktion zur Verfügung gestellt:Problem mit Callback in unendliche Scroll-Plugin
$('#secondary').masonry({ appendedContent: $(this) });
oder
$(this).masonry({ appendedContent: $(newElements) });
Aber ich bin vor ein seltsames Problem mit ihnen. Alles funktioniert gut, außer dass es scheint, dass jedes Mal, wenn die nächsten Posts abgeholt werden, viel Platz vor dem ersten Post steht. Für mich scheint dieser Raum die gleiche Höhe wie die Seite "1" zu haben. Dies ist der Code:
var $wall = jQuery('#secondary');
$wall.masonry({ singleMode: true,
itemSelector: '.box:visible'
});
und ich versuchte, verschiedene Funktionen für Callback-Option von Infinte Scroll:
$('#secondary').masonry({ appendedContent: $(this) });
oder
$(this).masonry({ appendedContent: $(newElements) });
mit dem ersten Rückruf Code I leeren Raum bekommen und mit zweiter Rückrufcode, Mauerwerk bricht mit Rückruf und zweite Seite kommt über die erste. Skript gibt mir einen Fehler: neweielements als "undefined Element".
Ich möchte wissen, was falsch ist, dass Mauerwerk alle Felder auf der zweiten Seite ausrichten, und nicht die erste Seite. Für mich scheint es, dass erste Seitenelemente an neue angefügt werden, anstatt die neuen Elemente an aktuelle Elemente anzuhängen.
aber ich kann die Quelle des Problems nicht finden.
Würden Sie mir bitte helfen, das Problem zu lösen.
Link zu Mauerwerk: http://github.com/desandro/masonry/raw/master/jquery.masonry.js
Unendliche Schriftrolle ist auch auf GitHub.
Danke!
Revision: voll unendlicher Code:
<script type="text/javascript">
(window.INFSCR_jQ ? jQuery.noConflict() : jQuery)(function($){
// Infinite Scroll jQuery+Wordpress plugin
$('#secondary').infinitescroll({
debug : false,
nextSelector : "div.navigation a:first",
loadingImg : "/infinite-scroll/ajax-loader.gif",
navSelector : "div.navigation",
contentSelector : "#secondary",
itemSelector : "div.box"
},function(){
Cufon.replace('li');
Cufon.replace('h1');
$('#secondary').masonry({ appendedContent: $(this) });
});
});
</script>
können Sie nach Ihrem vollständigen unendlichen Scroll-Code? Verwenden Sie Firebug auch, um zu überprüfen, was von der Anfrage der neuen Seiten zurückgegeben wird. – ifaour
Vielen Dank für den Kommentar. Ich habe der Frage den unendlichen Scroll-Code hinzugefügt. Checking with firebug zeigt, dass Maurerarbeiten funktionieren und die Kästen von der zweiten Seite ausgerichtet sind, aber alle mit hohen Höhen ausgerichtet sind! vor dem Scrollen zur zweiten Seite wird der erste Box-Stil, der von Masonry codiert wird, style = "position: absolute; left: 0px; top: 0px;" Nach dem Scrollen ändert sich der erste Boxstil in style = "position: absolute; left: 380px; top: 2754px;". – erick16
Der Link zum vollständigen InfineScroll-Code in GitHub lautet: http://github.com/paulirish/infinite-scroll – erick16