Hi All
I have been searching for an answer but I can’t find - probably because I am asking the wrong question!
Specifically I have a large map of the South West of England with some details on it. At it’s largest the map doesn’t make sense and is too big. But if I hover over map it brings up detail and is then clickable to take you through to further content. However I would also like to be able to provide some buttons on the side to enable increasing the map size. However, I still need to be able to move the whole map within the frame by click and move using a mouse.
You should minimize doing a lot of large image manipulation on the browse. Instead defer a lot of that to the server and only send the images people need for whatever size they are going for - which is how Google Maps and other online mapping solutions accomplish their map interactions.
With that said, you can certainly use CSS to zoom the map in and out. As long as the outer container has overflow: hidden set on it, your content will be clipped and only the zoomed in part of the image will be viewable through the viewport
Is that a solution that you would like to pursue?
Creating engaging and entertaining content for designers and developers since 1998.
