allow target to be specified as a string for controls, update the documentation to make more clear what element and target are for

src/objectliterals.jsdoc

@@ -170,8 +170,11 @@
 
 /**
  * @typedef {Object} olx.control.ControlOptions
- * @property {Element|undefined} element Element.
+ * @property {Element|undefined} element The element is the control's container
- * @property {Element|undefined} target Target.
+ *     element. This only needs to be specified if you're developing a custom
+ *     control.
+ * @property {Element|string|undefined} target Specify a target if you want the
+ *     control to be rendered outside of the map's viewport.
  * @todo stability experimental
  */
 

src/ol/control/control.js

@@ -32,7 +32,10 @@ ol.control.Control = function(options) {
    * @private
    * @type {Element|undefined}
    */
-  this.target_ = options.target;
+  this.target_ = goog.isDef(options.target) ? (goog.isString(options.target) ?
+      goog.dom.getElement(options.target) !== null ?
+      goog.dom.getElement(options.target) : undefined : options.target) :
+      undefined;
 
   /**
    * @private

test/spec/ol/control/control.test.js

@@ -24,6 +24,30 @@ describe('ol.control.Control', function() {
   });
 });
 
+describe('ol.control.Control\'s target', function() {
+  describe('target as string or element', function() {
+    it('transforms target from string to element', function() {
+      var target = goog.dom.createDom('div', {'id': 'mycontrol'});
+      document.body.appendChild(target);
+      var ctrl = new ol.control.Control({target: 'mycontrol'});
+      expect(ctrl.target_.id).to.equal('mycontrol');
+      goog.dispose(ctrl);
+    });
+    it('accepts element for target', function() {
+      var target = goog.dom.createDom('div', {'id': 'mycontrol'});
+      document.body.appendChild(target);
+      var ctrl = new ol.control.Control({target: target});
+      expect(ctrl.target_.id).to.equal('mycontrol');
+      goog.dispose(ctrl);
+    });
+    it('ignores non-existing target id', function() {
+      var ctrl = new ol.control.Control({target: 'doesnotexist'});
+      expect(ctrl.target_).to.equal(undefined);
+      goog.dispose(ctrl);
+    });
+  });
+});
+
 goog.require('goog.dispose');
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');