Canada - CSS & jQuery clickable map
Get this asset for free & save up to 25%
Become a member and save up to 25% sitewide on all assets plus a Drop of free assets every month. Annual members get their first download for free.
About the Product
CSSMap of Canada is a CSS & jQuery plugin that converts list of regions into fully responsive interactive map using the well known CSS sprites and works in all modern web browsers. It's delivered with editable .PSD source files customize map style.
Live demo https://cssmapsplugin.com/5/demo
Main features
-
Responsive - It's fully responsive - map can fit width and/or height of the browser window or map's container.
-
Accessible - Allows to navigate over the map using keyboard or display/print the plain list of regions if the map could not be displayed.
-
Touch support - Fully supports touch devices and mobile browsers. Allows to disable double tapping behavior to activate regions.
-
Visible list of regions - You can set visible list of regions without editing any files. Script allows to set position of the list, split it into columns, set width and columns gaps.
-
List of addresses - Show and hide any informations assigned to regions: offices, addresses of agents or anything else needed - even other maps.
-
Multiple selections - Allows to activate more than one region, and pass their values to the search engine script or input field. Number of active regions can be limited.
-
Markers over the map - Create list of items to place them over the map - set pin (marker) and tooltip to show any informations needed. Allows to disable clicking on regions as well.
-
Form support - Allows to fill in any input field on the same page with name, link or class of each region - works with multiple selections as well. It can also convert list of regions into select dropdown menu.
-
Navigation controls - Allows to navigate through regions using the next and previous links under the map.
-
Custom events
-
Easy setup and settings generator - Each map is delivered with detailed instructions, ready to use source code and visual options generator to help set up the CSSMap to your needs.
-
Editable .PSD files - layered vector shapes to customize map style.
Colors of the map can't be changed dynamically via JavaScript function etc.
Setup and settings
-
All details about setup and settings are explained at the demo page available in the package (index.html file).
-
Demo map and settings generator: https://cssmapsplugin.com/5/demo
-
Support and contact https://cssmapsplugin.com/contact
Requirements
- Basic HTML, CSS and JavaScript knowledge is required for a proper installation.
- The CSSMap plugin requires jQuery 1.7+
- Your website must be valid HTML/xHTML and contain no script errors.
Supported browsers:
- Google Chrome 1+
- Firefox 4+
- Internet Explorer 7+
- Opera 9+
- Safari 3+
- all major mobile browsers.
Appearance of the map may vary in different web browsers and/or OS.
Product Specs
- Created: Sep 17, 2016
- Compatible with: HTML/CSS, Adobe Photoshop
- File Size: 24.01 MB
- Vector
- Layered