This tutorial is only available for HTML5 Gallery Version 5.7 and above.

To add a loading animation to HTML5 gallery, you can add an extra div with class name html5gallery-loading before the html5gallery div, for example:

<!-- the html5gallery loading div -->

<div class="html5gallery-loading" style="display:block;margin:0 auto;width:300px;height:300px;background:url('html5gallery/loading.gif') no-repeat center center;"></div> 

<!-- your existing html5gallery div -->

<div class="html5gallery" data-skin="darkness" data-width="480" data-height="272" style="display:none;">

After the gallery is loaded, it will automatically hide the loading div.