[OpenLayers-Users] OL 2.6, customized navigation buttons

Eric Lemoine eric.c2c at gmail.com
Tue Sep 23 02:35:21 EDT 2008


Hi.

To have the panel displayed in a specific div try:

var p = new OpenLayers.Control.Panel({div: "your_div_id"});

Hope this helps.

Eric

2008/9/19, Andrea Battisti <battisti at actgate.com>:
> Hi,
>
>
> I'd like to change the default layout and size of the navigation buttons
> (pan + zoom).
>
>
> I am trying to use OpenLayers.Control.Button to add a few CSS-styled
> buttons and connect them to the pan and zoom actions.
> As suggested by the docs, I tried:
>
>
> var panel = new OpenLayers.Control.Panel();
> var button = new OpenLayers.Control.Button({
>     displayClass: "MyButton", trigger: myFunction
> });
> panel.addControls([button]);
> map.addControl( panel );
>
>
>
>
> As for the CSS :
>
>
> .olControlPanel div {
>   display:block;
>   width:  24px;
>   height: 24px;
>   margin: 5px;
>   background-color:red;
> }
>
> .olControlPanel .MyButtonItemInactive {
>   width:  22px;
>   height: 22px;
>   background-color: orange;
> }
>
>
>
> This way I can see the button, but it is overlayed on the map.
> How can I control its positioning? Can I place it outside the map?
>
>
> Also, what would be the best way to connect the buttons to the map
> navigation functions?
> I tried to set "myFunction" to something like map.zoomIn but didn't make it.
>
>
>
> Thanks in advance,
>
> --
> Andrea Battisti
> Applied Coherent Technology Corp.
>
>
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
>



More information about the Users mailing list