I am building a wordpress theme with Masonry (Desandro) and Infinitescroll (Paul Irish). The Demo is : http://needlestosaymore.com/demo/ and how I have written the index file is http://pastebin.com/zc05eVJL
The css part is
#page-nav{ display:block; width:100%;}
and the js part is http://pastebin.com/RGwT3H6T
Everything are working fine but what I see
- The .gif image of the infinitescroll is loading at the extreme topmost side which I want to make in center.
2.The Paged 2 section i.e. all the old posts in the bottom section of the page, when loads first time those are overlapped. I have checked in Firefox’s Inspector and found "<div id="primary" class="content-area" style="position: relative; height: 3762.33px;" , an inline-line style is generating giving a height of 3762.33px which I haven’t coded anywhere, what I guess that the js code container.masonry( 'appended', $newElems, true ); is generating this inline style.
But as soon as I refresh the page the overlapping issue moves off.
I am unable to understand what is the actual flaw I am doing.
Please help me to find out. Thanks in advance.
