Note that there are some explanatory texts on larger screens.

plurals
  1. POReplace scrolling action by onclick
    primarykey
    data
    text
    <p>I used this snippet of code (had to adapt it) to autoload (think Twitter) new posts on my page when scrolling.</p> <p>Since this is resource heavy for my server when a user scrolls fast, I want it to be activated when clicking on a button, lets say <code>&lt;button id="load_more"&gt;Load more&lt;/button&gt;</code></p> <p>Can anyone help me convert mine ? I can't get it to work... (plus eventually remove the busy indicator)</p> <p>Here is the code I use for autoscroll :</p> <pre><code>&lt;?php $maxPage = $this-&gt;Paginator-&gt;counter('%pages%'); ?&gt; &lt;script type="text/javascript"&gt; var lastX = 0; var currentX = 0; var page = 1; $(window).scroll(function () { if (page &lt; &lt;?php echo $maxPage;?&gt;) { currentX = $(window).scrollTop(); if (currentX - lastX &gt; 150 * page) { lastX = currentX - 150; page++; $("#busy-indicator").fadeIn(); $.get('&lt;?php echo $this-&gt;Html-&gt;url('/users/getmore_timeline/'.$this-&gt;Session-&gt;read('Auth.User.id')); ?&gt;/page:' + page, function(data) { setTimeout(function(){ $('#postList').append(data); var bi = $("#busy-indicator"); bi.stop(true, true); bi.fadeOut(); }, 500); }); } } }); &lt;/script&gt; </code></pre> <p>EDIT :</p> <p>I tried (from memory)</p> <pre><code>&lt;button onlick"LoadMore()"&gt;Load More&lt;/button&gt; &lt;?php $maxPage = $this-&gt;Paginator-&gt;counter('%pages%'); ?&gt; &lt;script type="text/javascript"&gt; function LoadMore () { if (page &lt; &lt;?php echo $maxPage;?&gt;) { page++; $("#busy-indicator").fadeIn(); $.get('&lt;?php echo $this-&gt;Html- &gt;url('/users/getmore_timeline/'.$this-&gt;Session-&gt;read('Auth.User.id')); ?&gt;/page:' + page, function(data) { setTimeout(function(){ $('#postList').append(data); var bi = $("#busy-indicator"); bi.stop(true, true); bi.fadeOut(); }, 500); }); } }; &lt;/script&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload