Ich habe eine Openlayers-Karte und ich habe ein Div positioniert, um innerhalb/über der Kartenkomponente zu sitzen.
Das funktioniert gut, aber wenn die Maus beim Ziehen der Karte durch/über das Div bewegt wird, wird der Ziehvorgang abgebrochen.
Wie kann ich verhindern, dass der Vorgang des Ziehens abgebrochen wird?
Danke, P.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>
</head>
<body>
<div id="map" style="margin:0px; width:300px; height:200px;"></div>
<div id="overlay" style="position:absolute; width:100px; height:75px; border:1px solid red; background-color:white; z-index:5000; text-align:center;">I want to drag through this</div>
<script type="text/javascript">
// create map
var map = new OpenLayers.Map("map", {"maxResolution":0.703125});
map.addLayers([new OpenLayers.Layer.WMS("World Map", "http://labs.metacarta.com/wms-c/Basic.py?", {layers:"basic", format:"image/png"})]);
map.zoomToMaxExtent();
// put div over map
Position.clone($("map"), $("overlay"), {offsetLeft:100, offsetTop:62.5, setWidth:false, setHeight:false});
</script>
</body>
</html>
EDIT: Lösung unter Verwendung der akzeptierten Antwort:
<div class="mapDragThrough">some content which gets positioned over the map</div>
initialise: function()
{
this.map.events.register("movestart", this, this.applyDragThrough);
this.map.events.register("moveend", this, this.applyDragThrough);
},
applyDragThrough: function(event)
{
var elements = Element.select(document.body, ".mapDragThrough");
var value = this.map.dragging ? "none" : "auto";
elements.invoke("setStyle", {"pointerEvents":value});
},