<link href= "Css/jquery.ui.base.css" rel= "stylesheet" type= "Text/css"/>
<link href= "Css/jquery.ui.theme.css" rel= "stylesheet" type= "Text/css"/>
<script src= "Http://maps.google.com/maps/api/js?sensor=false" type= "Text/javascript" ></script>
<script src= "Js/jquery-1.9.1.js" type= "Text/javascript" ></script>
<script src= "Js/jquery.mousewheel.js" type= "Text/javascript" ></script>
<script src= "Js/jquery.ui.core.js" type= "Text/javascript" ></script>
<script src= "Js/jquery.ui.widget.js" type= "Text/javascript" ></script>
<script src= "Js/jquery.ui.button.js" type= "Text/javascript" ></script>
<script src= "Js/jquery.ui.spinner.js" type= "Text/javascript" ></script>
<link href= "Css/demos.css" rel= "stylesheet" type= "Text/css"/>
<script type= "Text/javascript" >
$ (function () {
function Latlong () {
return new Google.maps.LatLng ($ ("#lat"). Val (), $ ("#lng"). Val ());
}
function position () {
Map.setcenter (Latlong ());
}
$ ("#lat, #lng"). Spinner ({
Step:. 001,
Change:position,
Stop:position
});
var map = new Google.maps.Map ($ ("#map") [0], {
Zoom:8,
Center:latlong (),
MapTypeId:google.maps.MapTypeId.ROADMAP
});
});
</script>
<style type= "Text/css" >
#map {
width:500px;
height:500px;
}
</style>
<body>
<label for= "lat" > Latitude </label>
<input id= "lat" name= "lat" value= "44.797"/>
<br>
<label for= "LNG" > Longitude </label>
<input id= "LNG" name= "LNG" value= " -93.278"/>
<div id= "Map" ></div>
<div class= "Demo-description" >
</div>
