i just wrote a simple code to run two map's
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.0/js/esri/dijit/css/Popup.css"/>
<script type="text/javascript">
var djConfig = {
parseOnLoad: true
};
</script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1">
</script>
<script type="text/javascript">
dojo.require("esri.map");
dojo.require("esri.dijit.Popup");
var basicMapObj, advancedMapObj;
function mapInitialization() {
var popup = new esri.dijit.Popup({
fillSymbol: new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.25]))
}, dojo.create("div"));
var startExtent = new esri.geometry.Extent({ "xmin": -10858450, "ymin": 3300000, "xmax": -10858500, "ymax": 3365000, "spatialReference": { "wkid": 102100} });
basicMapObj = new esri.Map("basicMap", { extent: startExtent, infoWindow: popup });
advancedMapObj = new esri.Map("advancedMap", { extent: startExtent, infoWindow: popup });
var basemapUrl = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer";
var dynamicUrl = "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer";
var basemapLayer = new esri.layers.ArcGISTiledMapServiceLayer(basemapUrl, { "id": "baseMap" });
var dynamicLayer = new esri.layers.ArcGISDynamicMapServiceLayer(dynamicUrl, { "id": "myMap", opacity: 0.80 });
basicMapObj.addLayers([basemapLayer, dynamicLayer]);
advancedMapObj.addLayers([basemapLayer, dynamicLayer]);
}
dojo.addOnLoad(mapInitialization);
</script>
</head>
<body>
<div id="basicMap" style="height:100%; width:40%;display:inline-block"></div>
<div id="advancedMap" style="height:100%; width:40%;display:inline-block"></div>
</body>
</html>
Link to code http://jsfiddle.net/jH9Wb/Some strange behaviour. Only the second object loads.Slider of first map controls the second.Where am i going wrong?