Learn how to dynamically add images to galleries via triggered web page events or while a user navigates through a gallery so that images are loaded lazily. Loading images lazily can improve the performance and usability of your gallery.
For this example, we're going to assume all our images are located in a single directory and follow specific naming conventions. This allows us to dynamically load more images according to those conventions.
To start out, we'll create a file in our
development directory named
dynamic-images.html with the contents as shown in the following code:
<!DOCTYPE html> <html lang="en"> <head> <script src="http://code.jquery.com/jquery.min.js"> </script> <script src="../galleria-1.2.8.min.js"></script> ...