tanzaku with infinite scroll?

bump

Hi, I managed to get the content to load on scroll, but I need to run a script to place the posts into the grid properly. At the minute the new posts are just loaded behind the old ones.

I’m not really brilliant with Javascript, so I don’t know what to put in the “Javascript to be called after the next posts are fetched” option. I was thinking it’d be vgsort or something, but I can’t get it to work. Any ideas?

The css selectors you need to get content to load are:

content css selector = #grid-wrapper
post css selector = #grid-wrapper div.post

navigation links css selector = div.pagination
previous posts link css selector = div.pagination a:first

Ok, I figured out a way.

I used the selectors gomako said (thanks for that) and added this code in the “Javascript to be called after the next posts are fetched:”

var setGrid = function () {
			return $("#grid-wrapper").vgrid({
				easeing: "jswing",
				time: 800,
				delay: 60,
				selRefGrid: "#grid-wrapper div.x1",
				selFitWidth: ["#container", "#footer"],
				gridDefWidth: 250 + 0 + 0 + 10,
				});
		};

		setTimeout(setGrid, 300);
		setTimeout(function() {
			$('#header').hide().css("visibility", "visible").fadeIn(500);
		}, 500);

It loads the posts but they didn’t come up correctly in the grid so I had to add this to my css theme file:
#infscr-loading{display:none!important;}
It seems to work correctly in Chrome but it does nothing in Firefox. Can somebody confirm me this? Thanks

Hi there,

great job.

but in the moment it doesn’t work for me. I hope that someone can help me out:

I placed the css: #infscr-loading{display:none!important;} in the theme style.css (thats the easier Part)

css

But where did you place the javascript? did you replace it in the header.php?

header

maybe you can show an image where you place or replace your code. (I used the selectors from gomako too.)

best daniel