title: Using an PNG or JPEG for Map with OpenLayers (Scale/Zoom Problem)
body: <p>I am using an image to display my map with OpenLayers. My JS code looks like this:</p>
  
  <pre><code>map = new OpenLayers.Map('map');
  
  var options = {numZoomLevels: 7,
                  isBaseLayer: true,
                  };
  
  var globe = new OpenLayers.Layer.Image(
      'Globe ESA',
      'http://upload.wikimedia.org/wikipedia/commons/0/07/World_map_blank_black_lines_4500px.gif',
      new OpenLayers.Bounds(-180, -90, 180, 90),
      new OpenLayers.Size(4500, 2234),
      options);
  
  map.addLayers(globe);
  
  markers = new OpenLayers.Layer.Markers("markers");
  map.addLayer(markers);
  
  map.addControl(new OpenLayers.Control.LayerSwitcher());
  map.zoomToMaxExtent();
  map.addControl(new OpenLayers.Control.MousePosition());
  </code></pre>
  
  <p>My CSS is:</p>
  
  <pre><code>#map {
      width: 640px;
      height: 480px;
      border: 1px solid black;
  }
  </code></pre>
  
  <p>But I can't get OpenLayers to scale down the large image. It is always display at full resolution and I can't zoom out to display the whole globe. Help please.</p>