-2

So I created a foreach loop like below, and it's loading in images from the server a couple hundred of em and I want it to load more images as I scroll down the page so it's not loading all the hundreds of images at once.

<div id="container">
  <?php foreach(glob("img/WeddingCakes/*.*") as $filename){ ?>
    <div class="item"><img src="img/WeddingCakes/<?php echo basename($filename) . "\n"; ?>" alt=""></div>
  <?php } ?>
</div>

All the images are stored in a database.

Any suggestions on how I would go about adding an infinite scroll?

Frank
  • 119
  • 1
  • 13
  • 2
    infinite scroll on a php foreach loop? what's that supposed to mean? – Federkun Apr 19 '16 at 21:52
  • I didn't understand either. An example would help. – Nelson Teixeira Apr 19 '16 at 21:53
  • 1
    You mean you want to load all your images in one shot and then have a big big big big scroll? If so, its a bad idea, consider to use ajax to load images when you reach the end of the page. But please, edit your question to be more specific. It hard to understand what you really want. – olibiaz Apr 19 '16 at 21:55
  • So I created a foreach loop like above, and it's loading in images from the server a couple hundred of em and I want it to load more mages as I scroll down the page so it's not loading all the hundreds of images at once. – Frank Apr 19 '16 at 21:57
  • You would have to use javascript + php to do a proper infinite scroll. Php can not do infinite scroll by itself. Or, you would have to do pagination + reload. – Rasclatt Apr 19 '16 at 21:57
  • You should search for lazy loading. But as the comment before says, you cannot handle that with php only. Many plugins exists for javascript to manage lazy loading. One among many [link](http://www.jqueryscript.net/loading/jQuery-Plugin-To-Smartly-Load-Images-While-Scrolling-loadScroll.html). take a look a the demo page. I guess its what you are looking for. – olibiaz Apr 19 '16 at 22:02
  • Any one have an example? – Frank Apr 20 '16 at 00:40

1 Answers1

1

Javascript will handle it better than php. Use ajax to call chuncks of images list according to scroll pos.

cpugourou
  • 775
  • 7
  • 11
  • 1
    Yep. PHP cannot control how the browser loads things. The browser will get all the content at once and then start loading all the links/imgs it sees. Javascript will need to be involved. Alternately you could implement pagination. – Keith Tyler Apr 19 '16 at 23:35