1 files changed, 67 insertions, 0 deletions
diff --git a/misc/openlayers/examples/mouse-position.html b/misc/openlayers/examples/mouse-position.html
new file mode 100644
index 0000000..924d3bc
--- /dev/null
+++ b/misc/openlayers/examples/mouse-position.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <title>MousePosition Control</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css">
+    <link rel="stylesheet" href="style.css" type="text/css">
+    <script src="../lib/OpenLayers.js" type="text/javascript"></script>
+    <script type="text/javascript">
+        var map;
+        function init(){
+            var map = new OpenLayers.Map('map');
+
+            map.addControl(
+                new OpenLayers.Control.MousePosition({
+                    prefix: '<a target="_blank" ' +
+                        'href="http://spatialreference.org/ref/epsg/4326/">' +
+                        'EPSG:4326</a> coordinates: ',
+                    separator: ' | ',
+                    numDigits: 2,
+                    emptyString: 'Mouse is not over map.'
+                })
+            );
+
+            var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
+                "http://vmap0.tiles.osgeo.org/wms/vmap0",
+                {layers: 'basic'} );
+
+            map.addLayers([ol_wms]);
+            if (!map.getCenter()) {
+                map.zoomToMaxExtent();
+            }
+            
+            map.events.register("mousemove", map, function(e) {
+                var position = this.events.getMousePosition(e);
+                OpenLayers.Util.getElement("coords").innerHTML = position;
+            });
+        }
+    </script>
+  </head>
+  <body onload="init();">
+    <h1 id="title">MousePosition Control</h1>
+    <div id="tags">
+      coordinate
+    </div>
+    <p id="shortdesc">
+      Use the MousePosition Control to display the coordinates of the cursor
+      inside or outside the map div.
+    </p>  
+    <div id="map" class="smallmap"></div>
+    <div id="coords" style="height: 1.5em;"></div>
+    <p>
+      This example also shows how to use the the "prefix", "separator" and
+      "numDigits" options to customize the output of the MousePosition-Control.
+      By also setting the "emptyString"-property, the contents of the controls
+      element are resetted to the given string when the mouse isn't above the
+      map.
+    </p>
+    <p>
+      Moving your mouse to the upper left corner of this map should return
+      'x=0,y=0' (pixel coordinates) -- in the past, it didn't in IE. If it
+      returns 'x=2,y=2', consider it a bug, and report it.
+    </p>
+  </body>
+</html>