diff --git a/css/ol.css b/css/ol.css index 824c28cc8e..f39721ff8f 100644 --- a/css/ol.css +++ b/css/ol.css @@ -259,28 +259,18 @@ button.ol-full-screen-true:after { left: .5em; background: #eee; background: rgba(255, 255, 255, 0.4); - border-radius: 4px; - outline: none; - overflow: hidden; - width: 1.5675em; + width: 1.7em; height: 200px; - padding: 3px; - margin: 0; } .ol-zoomslider-thumb { position: absolute; - display: block; background: #7b98bc; background: rgba(0,60,136,0.5); border-radius: 2px; - outline: none; - overflow: hidden; cursor: pointer; - font-size: 1.14em; - height: 1em; - width: 1.375em; + height: 1.1em; + width: 1.6em; margin: 3px; - padding: 0; } .ol-touch .ol-zoomslider { top: 5.5em; diff --git a/src/ol/control/zoomslidercontrol.js b/src/ol/control/zoomslidercontrol.js index 45942016f8..eee1c4bf22 100644 --- a/src/ol/control/zoomslidercontrol.js +++ b/src/ol/control/zoomslidercontrol.js @@ -68,8 +68,9 @@ ol.control.ZoomSlider = function(opt_options) { options.className : 'ol-zoomslider'; var thumbElement = goog.dom.createDom(goog.dom.TagName.DIV, [className + '-thumb', ol.css.CLASS_UNSELECTABLE]); - var sliderElement = goog.dom.createDom(goog.dom.TagName.DIV, - [className, ol.css.CLASS_UNSELECTABLE], thumbElement); + var containerElement = goog.dom.createDom(goog.dom.TagName.DIV, + [className, ol.css.CLASS_UNSELECTABLE, ol.css.CLASS_CONTROL], + thumbElement); /** * @type {goog.fx.Dragger} @@ -85,13 +86,13 @@ ol.control.ZoomSlider = function(opt_options) { goog.events.listen(this.dragger_, goog.fx.Dragger.EventType.END, this.handleDraggerEnd_, false, this); - goog.events.listen(sliderElement, goog.events.EventType.CLICK, + goog.events.listen(containerElement, goog.events.EventType.CLICK, this.handleContainerClick_, false, this); goog.events.listen(thumbElement, goog.events.EventType.CLICK, goog.events.Event.stopPropagation); goog.base(this, { - element: sliderElement + element: containerElement }); }; goog.inherits(ol.control.ZoomSlider, ol.control.Control);