I have a website that is built using Hugo Static site generator. The theme I have used is called Dimension and is a single page theme. I have a number of pages each written in a markdown file (.md file) but when I use hugo it combines all the files in the index.html
. The theme uses overyal (modals) to create different pages. Here is an example of how it works and looks. Here for example if you click on INTRO
link you go to this URL: http://themes.gohugo.io/theme/dimension/#intro
and the content of intro
is inside intro.md file. So the INTRO
page is called modal or overlay.
As I have a lot of links to web images (about 1000) and as all of them are placed in `index.html' it takes a long time to load, although I don't need all of them at once. Is there a way to load only images that are needed for a specific overlay?
Try out the Lazysizes script. It's lightweight and powerful: https://github.com/aFarkas/lazysizes