Use DOM instead of map canvas for ol.render.Box

examples/box-selection.css

@@ -0,0 +1,4 @@
+.ol-dragbox {
+  background-color: rgba(255,255,255,0.4);
+  border-color: rgba(100,150,0,1);
+}

examples/box-selection.js

@@ -8,9 +8,6 @@ goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
 goog.require('ol.source.OSM');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Fill');
-goog.require('ol.style.Stroke');
-goog.require('ol.style.Style');
 
 
 var vectorSource = new ol.source.Vector({
@@ -44,15 +41,7 @@ var selectedFeatures = select.getFeatures();
 
 // a DragBox interaction used to select features by drawing boxes
 var dragBox = new ol.interaction.DragBox({
-  condition: ol.events.condition.platformModifierKeyOnly,
-  style: new ol.style.Style({
-    fill: new ol.style.Fill({
-      color: [255, 255, 255, 0.4]
-    }),
-    stroke: new ol.style.Stroke({
-      color: [100, 150, 0, 1]
-    })
-  })
+  condition: ol.events.condition.platformModifierKeyOnly
 });
 
 map.addInteraction(dragBox);