MousePositionOustide

This fiddle demonstrates how to show the mouse position outside the map, in an OpenLayers Position.

HTML

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

CSS

#map {
    height: 300px;
    width: 600px;
}
#pos {
    position:absolute;
    top: 350px;
    left: 10px;
    height:40px;
    width: 200px;
    border: 2px solid;
}

JavaScript

var map;
var states;

var geographic = new OpenLayers.Projection("EPSG:4326");
var mercator = new OpenLayers.Projection("EPSG:3857");


map = new OpenLayers.Map('map', {
    projection: mercator,
    displayProjection: geographic
});

var osm = new OpenLayers.Layer.OSM("OpenStreetMap (Mapnik)");
states = new OpenLayers.Layer.WMS(
    "States", "http://demo.opengeo.org/geoserver/topp/wms", {
    LAYERS: 'topp:states',
    transparent: true
}, {
    isBaseLayer: false
});

map.addLayers([osm, states]);

var mp = new OpenLayers.Control.MousePosition({
    'div': pos
});

map.addControl(mp);

var cen = new OpenLayers.LonLat(-80, 50)
    .transform('EPSG:4326', 'EPSG:3857');

map.setCenter(cen, 2);