[OpenLayers-Users] overviewmap style properties

Alessio Di Lorenzo alessio.dilorenzo at gmail.com
Mon May 19 17:50:34 EDT 2008


OK Tim,

I will try as soon as this method.
Thanks a lot for your detailed explanation :-)

alessio



Tim Schaub ha scritto:
> Ok, a few things.
>
> If you do not include a link to the default stylesheet in a page that 
> creates an OpenLayers map, then OpenLayers magically appends this 
> stylesheet to the page for you.  This bit of magic will bite you if 
> you try to customize styles - since your declarations will likely be 
> evaluated before the default css loads.
>
> So, step one, add the following to your page head:
>
> <link rel="stylesheet" href="path/to/default/style.css" 
> type="text/css" />
>
> Then, below this, add any custom style:
>
> <style>
>     .olControlOverviewMapElement {
>         background-color: #FF0000;
>     }
> </style>
>
> I just did this for the Overview Map example 
> (http://openlayers.org/dev/examples/overviewmap.html), and I see, as 
> expected, a red background for my overview map.
>
> If you do not see this in IE, please try the following:
>
> In your map options, explicitly set the theme property to null - this 
> stops the magic bit from happening where it shouldn't be happening in 
> the first place.
>
> var map = new OpenLayers.Map("map_id", {theme: null});
>
> If this works in IE but the previous step did not (adding a link to 
> the default stylesheet and customizing style below), then open a 
> ticket with this as a bug and write back.
>
> For elements that are styled with css, you should *not* have to use 
> !important declarations.  This declaration means ignore any previous 
> and subsequent declarations and use this one.  In the above 
> description, the default css is loaded first and your custom 
> declarations follow - so !important is not necessary.
>
> The !important declaration is useful where style is declared in the 
> code.  This exists in many places in the library - it is an 
> acknowledged problem waiting for a champion.  The overview map is 
> already styled with css.
>
> Again, if you properly link the default style and add your custom 
> style after and this still doesn't work in IE, open a ticket and write 
> back.
>
> Tim
>
>
> Alessio Di Lorenzo wrote:
>> Yes... I solved right now with a google search... using !important as 
>> you says
>> I'm quite new to these "css tricks"... :-) (and I hate IE, again)
>>
>> thx to all, alessio
>>
>>
>>
>> Lance Dyas ha scritto:
>>> Did you try using the css
>>> padding 0px important!;
>>> background:none important!;
>>>
>>> ?
>>> Alessio Di Lorenzo wrote:
>>>> I'm doing some experiments.
>>>>
>>>> Defining the .olControlOverviewMapExtentRectangle class in my css 
>>>> it works well, applying the new style both in FF and IE.
>>>>
>>>> It seems like my .olControlOverviewMapElement class can't overwrite 
>>>> the correspondent class in the default style.css if using IE (I 
>>>> hate IE...)
>>>>
>>>>
>>>>
>>>>
>>>> Alessio Di Lorenzo ha scritto:
>>>>  
>>>>> Hi and thanks for your answer Christian.
>>>>> Your suggestion works well in Firefox :-)
>>>>> ...but not with IE.
>>>>> I added this css definition to my custom stylesheet:
>>>>>
>>>>> .olControlOverviewMapElement{
>>>>>        -moz-border-radius-bottomleft: 0pt;
>>>>>        -moz-border-radius-bottomright: 0pt;
>>>>>        -moz-border-radius-topright: 0pt;
>>>>>        -moz-border-radius-topleft: 0em;
>>>>>        background:none;
>>>>>        padding: 0px;           }
>>>>>
>>>>> on IE6 and IE7 the blue background and the padding values remains 
>>>>> active.
>>>>> maybe you understand what's wrong?
>>>>>
>>>>> alessio
>>>>>
>>>>>
>>>>>
>>>>>
>>>>> Christian López Espínola ha scritto:
>>>>>   
>>>>>> Just create a new css and link it in your page, or put a style 
>>>>>> section
>>>>>> in your page's head after the inclusion of the OL css..
>>>>>> There you override the styles that you want to change.
>>>>>>
>>>>>> HTH
>>>>>>
>>>>>> On Sun, May 18, 2008 at 6:10 PM, Alessio Di Lorenzo
>>>>>> <alessio.dilorenzo at gmail.com> wrote:
>>>>>>  
>>>>>>     
>>>>>>> Hi list,
>>>>>>>
>>>>>>> I'm working on the overview map outside the map viewport and 
>>>>>>> everything
>>>>>>> is going fine but I don't uderstand if it is possible to restyle 
>>>>>>> the
>>>>>>> overview map (by deleting, for example, the blue border) without 
>>>>>>> working
>>>>>>> directly on the style.css file.
>>>>>>>
>>>>>>> I read the online docs concerning the minRectDisplayClass
>>>>>>> http://dev.openlayers.org/releases/OpenLayers-2.6/doc/apidocs/files/OpenLayers/Control/OverviewMap-js.html#OpenLayers.Control.OverviewMap.OpenLayers.Control.OverviewMap 
>>>>>>>
>>>>>>>
>>>>>>> but I don't understand exactly how to use it and if this class is
>>>>>>> suitable to reach my purpouse... that is to manage the overview 
>>>>>>> map style.
>>>>>>>
>>>>>>> Could you give me some hints?
>>>>>>>
>>>>>>> thx in advance, alessio
>>>>>>> _______________________________________________
>>>>>>> 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
>>>>   
>>>
>>
>> _______________________________________________
>> Users mailing list
>> Users at openlayers.org
>> http://openlayers.org/mailman/listinfo/users
>>
>> !DSPAM:4033,48318292209727082231907!
>>
>
>




More information about the Users mailing list