Lazy Loading Google Maps jQuery Plugin
For Osvaldas Valutis’s latest responsive freelance project there was a contact page where he had to display several Google Maps instances on a single page. You can see where he is heading to: what if a user is not going to scroll down the page because the very first map is what a user was looking for? What if the user is accessing the page on a smartphone under the cellular internet connection?
The right way is to lazy-load the script file and map instances one by one. On every scroll and browser resize interval the Lazy-loading Google Maps Plugin checks whether there are any maps in the viewport to be displayed. If yes, it loads (if it wasnâ€™t loaded before) Google Maps API script file and then initiates the corresponding map instances. Finally, thereâ€™s a callback function which is called within every map instance initiation so that you can continue doing whatever you need with your maps.
Requirements: jQuery Framework
License: MIT License