diff options
-rw-r--r-- | www/css/fms.css | 12 | ||||
-rw-r--r-- | www/js/map-OpenLayers.js | 4 |
2 files changed, 14 insertions, 2 deletions
diff --git a/www/css/fms.css b/www/css/fms.css index f69ca69..9ab43a0 100644 --- a/www/css/fms.css +++ b/www/css/fms.css @@ -364,8 +364,18 @@ margin-right: 15px; } - #OpenLayers_Control_Crosshairs_crosshairs{ + #OpenLayers_Control_Crosshairs_crosshairs { pointer-events: none; + background-image: url(../images/crosshairs.png); + background-size: 100px 100px; + } + + /* it seems the mobile safari doesn't support resolution */ + @media only screen and (min-resolution: 320dpi), + only screen and (-webkit-min-device-pixel-ratio: 2) { + #OpenLayers_Control_Crosshairs_crosshairs { + background-image: url(../images/crosshairs@x2.png); + } } #login-options a.loggedin .signout{ diff --git a/www/js/map-OpenLayers.js b/www/js/map-OpenLayers.js index 35def29..372d09a 100644 --- a/www/js/map-OpenLayers.js +++ b/www/js/map-OpenLayers.js @@ -280,7 +280,9 @@ OpenLayers.Control.Crosshairs.prototype = OpenLayers.Control.prototype.draw.apply(this, arguments); position = this.getIdealPosition(); this.buttons = new Array(); - var imgLocation = OpenLayers.Util.getImagesLocation() + "crosshairs.png"; + // we set the background image in CSS so we can use media queries for retina + // screens so we want an blank image here + var imgLocation = OpenLayers.Util.getImagesLocation() + "blank.gif"; return OpenLayers.Util.createAlphaImageDiv(OpenLayers.Control.Crosshairs.DIV_ID, position, this.imageSize, imgLocation, "absolute"); }, |