A lightweight jQuery plugin to lazy / late load Google Maps API with custom API key, zoom arrange and location.
Plugin Preview
How to start using jQuery?
More jQuery Top, Best and New Plugins
Top 100 jQuery Plugins
Plugin Overview
| Plugin: | lazymap |
| Author: | Martino Gabrielli |
| Licence: | MIT Licence |
| Published: | March 1, 2024 |
| Repository: | Fork on GitHub |
| Dependencies: | jQuery 1.3.1 or Latest version |
| File Type: | zip archive (HTML, CSS & JavaScript) |
| Package Size: | 3.68 KB |
How to Use jQuery Lazy Load Google Maps’s Plugin:
1. To getting started with lazymap plugin, load the jQuery and lazymap JavaScript files into HTML document.
<!-- jQuery --> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <!-- Lazy Load Google Map Js --> <script src="jquery.lazymap.js"></script>
2. Create a container (a div element) in which the map will be loaded. Also define the zoom arrange and map’s latitude & longitude data with the following mentioned data attributes.
<div class="map" data-lat="41.898743" data-lng="12.498862" data-zoom="11"></div>
3. Initialize the plugin in jQuery document ready function with that div selector and insert your Google Map API key into it.
$(document).ready(function(){
$('.map').lazymap({
apiKey: '',
culture: 'it'
});
});
Similar Code Snippets:
I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences.
I truly enjoy what I’m doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.