[OpenLayers-Users] Button Active CSS Styling

Kris Geusebroek kgeusebroek at xebia.com
Thu Jan 7 10:07:20 EST 2010


Hi Henry,

In your code I can see the button is added to the panel but is the panel
also added to the map?
And also the button needs to be activated to get the active style
In the activate method a check is made that the map is set on the
control

        if(this.map) {
            OpenLayers.Element.addClass(
                this.map.viewPortDiv,
                this.displayClass.replace(/ /g, "") + "Active"
            );
        }

Cheers Kris

-----Original Message-----
From: users-bounces at openlayers.org [mailto:users-bounces at openlayers.org]
On Behalf Of Henry Rotzoll
Sent: Thursday, January 07, 2010 4:03 PM
To: users at openlayers.org
Subject: Re: [OpenLayers-Users] Button Active CSS Styling


Hey Kris,

first of all thanks for your help.

Unfortunately this hasn't changed anything.

Here is changed code for the button:
var btn = new $wnd.OpenLayers.Control.Button
({trigger:  myTrigger,
title: 'Enable or Disable the Area of Interest Selection',
displayClass: 'olControlButton'});

Bye Henry



Kris Geusebroek wrote:
> 
> Hi 
> 
> You need to add this to your button I guess
> 
> displayClass: "olControlButton"
> 
> Cheers Kris
> 
> -----Original Message-----
> From: users-bounces at openlayers.org
[mailto:users-bounces at openlayers.org]
> On Behalf Of Henry Rotzoll
> Sent: Thursday, January 07, 2010 3:43 PM
> To: users at openlayers.org
> Subject: [OpenLayers-Users] Button Active CSS Styling
> 
> 
> Hi there,
> 
> I have a problem with a custom button, that I've added to the map.
> Here is the code for that:
> var btn = new $wnd.OpenLayers.Control.Button
> ({trigger:  myTrigger,
> title: 'Enable or Disable the Area of Interest Selection'});
> panel.addControls(btn);
> map.addControl(panel);
> 
> Now here is the CSS code that I use to style the button:
> .olControlPanel .olControlButtonItemActive { 
>   width:  24px;  
>   height: 22px;
>   background-color: blue;
>   background-image:
>
url("http://www.openlayers.org/dev/theme/default/img/draw_polygon_on.png
> ");
>   background-repeat: no-repeat;
> }
> .olControlPanel .olControlButtonItemInactive { 
>   width:  24px;  
>   height: 22px;
>   background-color: orange;
>   background-image:
>
url("http://www.openlayers.org/dev/theme/default/img/draw_polygon_off.pn
> g");
>   background-repeat: no-repeat;
> }
> 
> The problem is that the inactive button style is shown, i. e. the
> graphic is
> loaded, but the active graphic is never retrieved from the server.
> 
> I've added also some default buttons like Zoom Box with the same
method.
> 
> Here everything works fine.
> 
> Does anybody have an idea? Many thanks in advance.
> 
> Best regards,
> Henry
> -- 
> View this message in context:
> http://n2.nabble.com/Button-Active-CSS-Styling-tp4266755p4266755.html
> Sent from the OpenLayers Users mailing list archive at Nabble.com.
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
> 
> 

-- 
View this message in context:
http://n2.nabble.com/Button-Active-CSS-Styling-tp4266755p4266851.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.
_______________________________________________
Users mailing list
Users at openlayers.org
http://openlayers.org/mailman/listinfo/users



More information about the Users mailing list