Zoom To MaxExtent and OpenLayers.Control.ZoomToMaxExtent
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/openlayers/2.12/OpenLayers.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/openlayers/2.12/theme/default/style.css">
<link rel="stylesheet" href="http://dev.openlayers.org/releases/OpenLayers-2.13.1/examples/style.css">
<body onload="init()">Zoom in and then Click on the world-icon to zoom back To Max-Extent
<br />
<div id="map" class="smallmap"></div> <a href="javascript:map.zoomToMaxExtent();">Zoom To Max Extent (click!)</a>
</body>
<br />
<p>see also <a href="http://gis.stackexchange.com/questions/23836/openlayers-zooming-and-panning-restrictions-dont-work">http://gis.stackexchange.com/questions/23836/openlayers-zooming-and-panning-restrictions-dont-work</a>
</p>
CSS
.olControlPanel {
position:absolute;
left:50px;
}
.olControlPanel div {
display:block;
width: 24px;
height: 24px;
margin: 5px;
background-color:white;
}
.olControlPanel .olControlZoomToMaxExtentItemInactive {
width: 18px;
height: 18px;
background-image: url("http://dev.openlayers.org/releases/OpenLayers-2.13/img/zoom-world-mini.png");
}
JavaScript
var map;
function init() {
var layer = new OpenLayers.Layer.OSM(
"OpenStreet Maps", null, {
resolutions: [19567.87923828125, 9783.939619140625,
4891.9698095703125, 2445.9849047851562, 1222.9924523925781,
611.4962261962891, 305.74811309814453, 152.87405654907226,
76.43702827453613, 38.218514137268066, 19.109257068634033,
9.554628534317017, 4.777314267158508, 2.388657133579254,
1.194328566789627, 0.5971642833948135, 0.29858214169740677,
0.14929107084870338, 0.07464553542435169],
serverResolutions: [156543.03390625, 78271.516953125,
39135.7584765625, 19567.87923828125, 9783.939619140625,
4891.9698095703125, 2445.9849047851562, 1222.9924523925781,
611.4962261962891, 305.74811309814453, 152.87405654907226,
76.43702827453613, 38.218514137268066, 19.109257068634033,
9.554628534317017, 4.777314267158508, 2.388657133579254,
1.194328566789627, 0.5971642833948135, 0.29858214169740677,
0.14929107084870338, 0.07464553542435169]
});
var extent = [-1500000, 4000000, 5600000, 11000000];
map = new OpenLayers.Map('map', {
projection: 'EPSG:3857',
//maxExtent: extent,
//restrictedExtent: extent,
layers: [layer]
});
map.addControl(new OpenLayers.Control.LayerSwitcher());
var panel = new OpenLayers.Control.Panel();
panel.addControls([
new OpenLayers.Control.ZoomToMaxExtent({
title: "Zoom to the max extent"
})]);
map.addControl(panel);
map.zoomToMaxExtent();
}