I'm using infiniteajaxscroll plugin to load new content into a div and it works fine with safari and chrome. In firefox I can see that the jquery-ias code is hiding the pagination div but when I reach the end of the page nothing happens and I can't see any error in Firebug.
I also noticed that in the overflow example of IAS website I get the same behaviour. It loads more items with safari and chrome but not with firefox. This is an example of my code.
HTML:
<div style="margin:0; padding:0; width:100%; height:100%;" id="results">
<div id="articles">
<div id="article-79" class="article">....</div>
<div id="article-80" class="article">....</div>
<div id="article-81" class="article">....</div>
<div id="article-82" class="article">....</div>
...
</div>
<div id="pagina" style="display: none;"><a class="next" href="/lista.php?p=2&cod=0&idl=1&idt=6">Next</a></div>
Javascript:
<script>
var ias= $j.ias({
container : '#articles', // main container where data goes to append
item: '.article', // single items
pagination: '#pagina', // page navigation
next: '.next',
delay : 200,
negativeMargin:300
});
ias.initialize();
ias.extension(new IASSpinnerExtension());
ias.extension(new IASNoneLeftExtension({
text: 'END' // override text when no pages left
}));
and this is the guide I've followed to make the php page.
EDIT:
Fixed. For anyone having similar issue, I was using another JS script that added a "position: absolute" style on <body>
which caused this issue.