diff --git a/css/ol.css b/css/ol.css
index 9f7f54350c..44bfbd35fe 100644
--- a/css/ol.css
+++ b/css/ol.css
@@ -99,6 +99,9 @@ a.ol-full-screen-true:after {
margin: 1px;
padding: 0px 2px;
}
+.ol-unsupported {
+ display: none;
+}
.ol-viewport .ol-unselectable {
-webkit-touch-callout: none;
-webkit-user-select: none;
diff --git a/examples/full-screen.html b/examples/full-screen.html
index 4b51a67432..3e642b630c 100644
--- a/examples/full-screen.html
+++ b/examples/full-screen.html
@@ -49,6 +49,7 @@
Full screen control example
Example of a full screen control. Click the control in the top right corner to go full screen. Click it again to exit full screen.
+
If there is no button on the map, your browser does not support the Full Screen API.
diff --git a/src/ol/control/fullscreencontrol.js b/src/ol/control/fullscreencontrol.js
index a3da48d31d..126997fff1 100644
--- a/src/ol/control/fullscreencontrol.js
+++ b/src/ol/control/fullscreencontrol.js
@@ -41,7 +41,8 @@ ol.control.FullScreen = function(opt_options) {
this.handleFullScreenChange_, false, this);
var element = goog.dom.createDom(goog.dom.TagName.DIV, {
- 'class': this.cssClassName_ + ' ' + ol.css.CLASS_UNSELECTABLE
+ 'class': this.cssClassName_ + ' ' + ol.css.CLASS_UNSELECTABLE +
+ (!goog.dom.fullscreen.isSupported() ? ol.css.CLASS_UNSUPPORTED : '')
}, aElement);
goog.base(this, {
@@ -65,14 +66,14 @@ goog.inherits(ol.control.FullScreen, ol.control.Control);
* @private
*/
ol.control.FullScreen.prototype.handleClick_ = function(browserEvent) {
+ if (!goog.dom.fullscreen.isSupported()) {
+ return;
+ }
browserEvent.preventDefault();
var map = this.getMap();
if (goog.isNull(map)) {
return;
}
- if (!goog.dom.fullscreen.isSupported()) {
- return;
- }
if (goog.dom.fullscreen.isFullScreen()) {
goog.dom.fullscreen.exitFullScreen();
} else {
diff --git a/src/ol/css.js b/src/ol/css.js
index b717b3d0d4..5dbbddd11d 100644
--- a/src/ol/css.js
+++ b/src/ol/css.js
@@ -7,3 +7,11 @@ goog.provide('ol.css');
* @const {string}
*/
ol.css.CLASS_UNSELECTABLE = 'ol-unselectable';
+
+
+/**
+ * The CSS class for unsupported feature.
+ *
+ * @const {string}
+ */
+ol.css.CLASS_UNSUPPORTED = 'ol-unsupported';