Re: css corner images with transparency

[Thorsten Scherler <th...@apache.org>]

El jue, 02-03-2006 a las 17:40 +0100, Johannes Schaefer escribió:
> Cyriaque Dupoirieux wrote:
> > Thorsten Scherler a écrit :
> >> El jue, 02-03-2006 a las 16:24 +0100, Johannes Schaefer escribió:
> >>  
> >>> Hi!
> >>>
> >>> How can we have transparent corner images for the forrest tabs?
> >>>
> >>> The description on how to generate the corner images may be found
> >>> here:
> >>>   http://forrest.apache.org/docs_0_70/howto/howto-corner-images.html
> >>>
> >>> But I don't know how to get "1{$backgroundColor}" to be transparent.
> >>> Any ideas?
> >>>     
> >>
> >> well did you try "1{$backgroundColor}" = "1transparent"
> >>
> >> If that is not working you need to find the color code of
> >> transparent. ;-)
> >>   
> > In fact, the transparency is define (between 0 and 1) with the opacity
> > attribute of a SVG shape.
> > For instance - if I remember - opacity="1" means it is completly
> > transparent,
> > opacity=".3" means the shape is 30% transparent...
> > 
> > In our case, there is no argument to specify this in the call...
> 
> I tried the following in corner-imports.svg.xslt for the bg-rect:
>     <rect x="-1" y="-1" width="{$biggersize}"
>      height="{$biggersize}" fill="black" opacity="0.5"/>
> 
> Opacity=0.0 (completely transparent) doesn't work, the problem is that
> the box behind the tabs (or menu, ...) need to be covered by the
> rounded corner. With some value for opacity this box shines through.
> 
> So, there's no chance to get transparent rounded corners in the
> current implementation (my personal verdict) :-(

Like I wrote in the currently actual thread, it may not be possible
out-of-the-box but have you tried
<rect x="-1" y="-1" width="{$biggersize}"
     height="{$biggersize}" opacity="0.5"/>

*without* @fill!

salu2
-- 
thorsten

"Together we stand, divided we fall!" 
Hey you (Pink Floyd)

Re: css corner images with transparency

[Johannes Schaefer <jo...@uidesign.de>]

Thorsten Scherler wrote:
> El jue, 02-03-2006 a las 17:40 +0100, Johannes Schaefer escribió:
>> Cyriaque Dupoirieux wrote:
>>> Thorsten Scherler a écrit :
>>>> El jue, 02-03-2006 a las 16:24 +0100, Johannes Schaefer escribió:
>>>>  
>>>>> Hi!
>>>>>
>>>>> How can we have transparent corner images for the forrest tabs?
>>>>>
>>>>> The description on how to generate the corner images may be found
>>>>> here:
>>>>>   http://forrest.apache.org/docs_0_70/howto/howto-corner-images.html
>>>>>
>>>>> But I don't know how to get "1{$backgroundColor}" to be transparent.
>>>>> Any ideas?
>>>>>     
>>>> well did you try "1{$backgroundColor}" = "1transparent"
>>>>
>>>> If that is not working you need to find the color code of
>>>> transparent. ;-)
>>>>   
>>> In fact, the transparency is define (between 0 and 1) with the opacity
>>> attribute of a SVG shape.
>>> For instance - if I remember - opacity="1" means it is completly
>>> transparent,
>>> opacity=".3" means the shape is 30% transparent...
>>>
>>> In our case, there is no argument to specify this in the call...
>> I tried the following in corner-imports.svg.xslt for the bg-rect:
>>     <rect x="-1" y="-1" width="{$biggersize}"
>>      height="{$biggersize}" fill="black" opacity="0.5"/>
>>
>> Opacity=0.0 (completely transparent) doesn't work, the problem is that
>> the box behind the tabs (or menu, ...) need to be covered by the
>> rounded corner. With some value for opacity this box shines through.
>>
>> So, there's no chance to get transparent rounded corners in the
>> current implementation (my personal verdict) :-(
> 
> Like I wrote in the currently actual thread, it may not be possible
> out-of-the-box but have you tried
> <rect x="-1" y="-1" width="{$biggersize}"
>      height="{$biggersize}" opacity="0.5"/>
> 
> *without* @fill!

I *got* them transparent but:
the box around the tab will shine through anyway.

>> Opacity=0.0 (completely transparent) doesn't work, the problem is that
>> the box behind the tabs (or menu, ...) need to be covered by the
>> rounded corner. With some value for opacity this box shines through.

To illustrate this:

  +------------+  +---------+
  | tab-label  |  |  tab2   |
--+            +---------------...

The "+" is where the rounded corners will cover the box
with an image in the background color. If you make them
transparent not the background will shine through but
the box. :-(

Johannes



> 
> salu2


-- 
User Interface Design GmbH * Teinacher Str. 38 * D-71634 Ludwigsburg
Fon +49 (0)7141 377 000 * Fax  +49 (0)7141 377 00-99
Geschäftsstelle: User Interface Design GmbH * Lehrer-Götz-Weg 11 * D-81825
München
www.uidesign.de

Buch "User Interface Tuning" von Joachim Machate & Michael Burmester
www.user-interface-tuning.de