[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