jQuery + OpenLayers

HTML

<script src="http://openlayers.org/dev/OpenLayers.js"></script>
<div id="map"></div>

CSS

body {
    padding: 0;
    margin: 0;
}
 
html, body, #map {
    height: 100%;
    width: 100%;
}

JavaScript

var mapOptions = {
    div: "map",
    projection: new OpenLayers.Projection("EPSG:900913"),
    units: "m"
};
 
map = new OpenLayers.Map('map', mapOptions);
 
var osm = new OpenLayers.Layer.OSM();
map.addLayer(osm);
 
var layer0 = new OpenLayers.Layer.WMS("layer0", "http://sedac.ciesin.columbia.edu/geoserver/ows", {
    layers: 'gpw-v3:gpw-v3-population-density_2000',
    transparent: true
}, {
    opacity: 0.5,
    isBaseLayer: false
});
 
map.addLayer(osm);
map.addLayer(layer0);
 
var layer1 = new OpenLayers.Layer.XYZ( "layer1", "http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/${z}/${y}/${x}",{sphericalMercator: true, isBaseLayer: false});
map.addLayer(layer1);
 
var layer2 = new OpenLayers.Layer.XYZ( "layer2", "http://a.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png",{sphericalMercator: true, isBaseLayer: false});
map.addLayer(layer2);

var layer3 = new OpenLayers.Layer.XYZ( "layer3", "http://a.tile.openstreetmap.fr/hot/${z}/${x}/${y}.png",{sphericalMercator: true, isBaseLayer: false});
map.addLayer(layer3);

var layer4 = new OpenLayers.Layer.XYZ( "layer4", "http://otile3.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",{sphericalMercator: true, isBaseLayer: false});
map.addLayer(layer4);

var layer5 = new OpenLayers.Layer.XYZ( "layer5", "http://ingreelab.net/C04AF0B62BEC112E8D7242FB848631D12D252728/${z}/${x}/${y}.png",{sphericalMercator: true, isBaseLayer: false});
map.addLayer(layer5);


map.addControl(new OpenLayers.Control.LayerSwitcher());
map.setCenter(new OpenLayers.LonLat(0, 0), 2);