Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I need to use PanZoomBar in my application.

var panZoomBar = new OpenLayers.Control.PanZoomBar();
map.addControl(panZoomBar);

Also I need to overwrite the PanZoomBar css style. I overwrite the whole bar.

.olControlPanZoomBar {
    top: 38px !important;
    left: 18px !important;
    width: 44px;
    height: 214px;
    background: transparent url(../images/zoombar_bg.png) no-repeat 50% 100%;
}

But how I can get access and overwrite the default buttons? I mean:

.whatName(Id)ShowIWriteHere {
    some style
}
share|improve this question
add comment

1 Answer

up vote 2 down vote accepted

The default buttons are images, not html/css elements.

Your only options are to edit the images directly. They will be located here: openlayers/theme/default/img

Or you can download the images from the git source directly and then make modifications as you wish here: https://github.com/openlayers/openlayers/tree/master/theme/default/img

Another method would be to use someone else's navigation images, like https://github.com/developmentseed/openlayers_themes/tree/master/dark

Or you can build on top of developmentseed's source vector graphics and create your own!! https://github.com/developmentseed/openlayers_themes/tree/master/dark_src

Good luck!

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.