Klonen von Inhalten, Anhängen und Voranstellen von Javascript, Jquery, Jquery-Isotopen

Ich versuche zu bauen eine unendliche Schriftrolle sowohl nach oben als auch nach unten mit der isotope plugin.

Aber ich bin wieder festgefahren, nachdem ich Hilfe bekommen habehier auf stackoverflow. Leider wird der Inhalt nur einmal geklont, aber ich beabsichtige, ihn jedes Mal zu klonen und anzufügen / anzuhängen, sobald der Benutzer den unteren oder oberen Rand der Seite erreicht.

Ich bin neu bei jQuery und würde mich wirklich freuen, wenn Sie mir beim Debuggen helfen könnten.

http://jsfiddle.net/sqJqr/7/

$(document).ready(function() {
var $newElements = $(".isotope").first().children().clone();
$(window).scroll(function() {
if ( $(window).scrollTop() >= ($("body").height() - $(window).height()) ) {
$(".isotope").append( $newElements ).isotope( "appended", $newElements );
$isotope = $(".isotope").first().children().clone();
}
else if ( $(window).scrollTop() == 1 ) {
$(".isotope").prepend( $newElements ).isotope("reloadItems").isotope({ sortBy: "original-order" });
$isotope = $(".isotope").first().children().clone();
}
return false;
});
});

Antworten:

Es klingt wie Sie versuchen, eine unendliche Schriftrolle. Das Isotop-Plugin ist mit dem Infinite-Scroll-Plugin interoperabel, sodass Sie kein Problem haben sollten Dies Seite:

$(function(){

var $container = $("#container");

$container.isotope({
itemSelector : ".element"
});

$container.infinitescroll({
navSelector  : "#page_nav",    // selector for the paged navigation
nextSelector : "#page_nav a",  // selector for the NEXT link (to page 2)
itemSelector : ".element",     // selector for all items you"ll retrieve
loading: {
finishedMsg: "No more pages to load.",
img: "http://i.imgur.com/qkKy8.gif"
}
},
// call Isotope as a callback
function( newElements ) {
$container.isotope( "appended", $( newElements ) );
}
);


});