LayerSwitcher Redraw Issue

[ttd]

On our application, we are setting a custom styles for the overlay switcher on client-side. It work fine on IE browser. However, on Firefox 3.0.17 and Safari 4.04, but when I minimize and then maximize the overlayswitcher, it redraw to the default width.

I also tried re-setting the custom style during the body onmouseover. Although it changes all the custom styles, when I click minimize, it displays some of the layer background.

Is there a workaround on setting and retaining the custom style? I shouldn't have to use the body onmouseover to reset the style?

Please advise. Thanks in advance for your assistance

 

function OnMapCreated(map) {     setstyle(map);   }

function setstyle(map) (

    var controls = map.getControlsByClass('OpenLayers.Control.LayerSwitcher');

    if (controls && controls.length > 0) {

        overlaySwitcher = controls[0];

        overlaySwitcher.layersDiv.style.fontSize = '12';

        overlaySwitcher.layersDiv.style.fontFamily = 'Verdana';

        overlaySwitcher.layersDiv.style.color = '#000066';

        if (navigator.appName == 'Netscape') {

            overlaySwitcher.div.style.width = '11em';

        }

        overlaySwitcher.redraw();

    }

}

On body onmouseover,

     onmouseover="setstyle();"

[Khalil]

Hi, ttd

When you  minimize and then maximize the OverlaySwitcher, it will give a default "20em" width for the DIV of OverlaySwitcher, but you could chang it in maximizeControl method of OverlaySwitcher. Here is the sample code for you. Please check out it.


        function OnMapCreating(map) {
            OpenLayers.Control.LayerSwitcher = OpenLayers.Class(OpenLayers.Control.LayerSwitcher, {
                maximizeControl: function(e) {
                    // you could chang it here.
                    this.div.style.width = "60em";
                    this.div.style.height = "";

                    this.showControls(false);

                    if (e != null) {
                        OpenLayers.Event.stop(e);
                    }
                }
            });

            setstyle(map);
        }
        function setstyle(map) {
            var controls = map.getControlsByClass('OpenLayers.Control.LayerSwitcher');
            if (controls && controls.length > 0) {
                overlaySwitcher = controls[0];
                overlaySwitcher.layersDiv.style.fontSize = '12';
                overlaySwitcher.layersDiv.style.fontFamily = 'Verdana';
                overlaySwitcher.layersDiv.style.color = '#000066';
                if (navigator.appName == 'Netscape') {
                    overlaySwitcher.div.style.width = '11em';
                }
            }
        }


Thanks,

Khalil