Hover over feature layer does not work!
<!DOCTYPE html>
<html class="no-js dj_ie dj_ie9 dj_contentbox" lang="en">
<head>
<meta charset="UTF-8" />
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<meta content="Mohammed Zainuddin" name="author" />
<title>U-Drive Locator</title>
<link href="css/normalize.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="esri.css">
<!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<script type="text/javascript" src="js/modernizr.custom.js"></script>
<script type="text/javascript" src="js/jquery.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui.min.js" ></script>
<script type="text/javascript" src="js/vendors/jquery.slimscroll.min.js"></script>
<script type="text/javascript" src="js/jquery.fullPage.js"></script>
<script type="text/javascript" src="js/cssrefresh.js"></script>
<!--[if IE]>
<script type="text/javascript">
var console = { log: function() {} };
</script>
<![endif]-->
<script src="js/gsitu-head2.js"></script>
<script src="js/classie.js"></script>
<script src="js/gnmenu.js"></script>
<script src="js/init.js"></script>
<!-- Esri -->
<link href="esri.css" rel="stylesheet">
<script src="identi1.dat"></script>
<script type="text/javascript"> var djConfig = { parseOnLoad: true };</script>
<script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1" type="text/javascript">
</script>
<script type="text/javascript"> dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("esri.layers.FeatureLayer");
dojo.require("esri.dijit.AttributeInspector");
dojo.require("esri.tasks.query");
dojo.require("dojo.number");
dojo.require("dojo/on");
var map;
var extent = new esri.geometry.Extent({"xmin" :5564986.97 ,"ymin" : 3029612.93 ,"xmax": 5599383.63 ,"ymax": 3052544.04, "spatialReference":{"wkid": 102100}});
function init()
{
map = new esri.Map("mapDiv");
var basemap = new esri.layers.ArcGISTiledMapServiceLayer("basemapLink");
map.addLayer(basemap);
var template1 = "This is Template 1";
var template2 = "This is Template 2";
var template3 = "This is Template 3";
// --------------------------------------------------------------------------------
var infoTemplate = new esri.InfoTemplate();
infoTemplate.setTitle("<b>${BUILDING_NO}</b>");
infoTemplate.setContent("default");
map.infoWindow.resize(450,305);
var featureLayer = new esri.layers.FeatureLayer("featureLayerLink", {
mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
outFields: ["*"],
infoTemplate: infoTemplate
});
featureLayer.on("mouse-over",function (event) {
//map.graphics.clear(); //use the maps graphics layer as the highlight layer
var graphic = event.graphic;
if (graphic.attributes.OBJECTID == 1) {
infoTemplate.setContent(template1 );
}
else
if(graphic.attributes.OBJECTID == 2){
infoTemplate.setContent(template2 );
}
else
if(graphic.attributes.OBJECTID == 3){
infoTemplate.setContent(template3 );
}
featureLayer.on("mouse-out", function ()
{
map.graphics.clear();
map.infoWindow.hide();
});
dojo.connect(featureLayer, "onMouseOver", function (evt) {
map.setMapCursor("pointer");
});
dojo.connect(featureLayer, "onMouseOut", function () {
map.setMapCursor("default");
});
//***********************************************************************
map.addLayer(featureLayer);
map.setExtent(extent );
var resizeTimer;
dojo.connect(map, 'onLoad', function(theMap) {
dojo.connect(dijit.byId('map'), 'resize', function() {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function() {
map.resize();
map.reposition();
}, 500);
});
});
}
dojo.ready(init);
dojo.addOnLoad(init);
</script>
</head>
<body>
<!-- ******************************************************** Map ******************************************************* -->
<div id="mapDiv"> </div>
<!-- ******************************************************** Map ******************************************************* -->
</body>
</html>
