.ol-miniscroll { position: relative; } .ol-miniscroll:hover .ol-scroll { opacity: .5; transition: opacity 1s; } .ol-miniscroll .ol-scroll { touch-action: none; position: absolute; right: 0px; width: 9px; height: auto; max-height: 100%; opacity: 0; border-radius: 9px; transition: opacity 1s .5s; overflow: hidden; z-index: 1; } .ol-miniscroll .ol-scroll > div { touch-action: none; position: absolute; top: 0; right: 0px; width: 9px; height: 9px; box-shadow: inset 10px 0 currentColor; border-radius: 9px / 12px; border: 2px solid transparent; box-sizing: border-box; cursor: pointer; } .ol-miniscroll .ol-scroll.ol-100pc { opacity: 0; }