Re: [Bulk] Re: [css3-background] box-shadow syntax

I think the default behavior should be:

- The box-shadow follow the object's edge (self if it's an image, or if they are transparent zones inside non-transparent zones) (> like filter: glow(strength=10, color=red) of IE)

- The opactity of the object should change the opacity of the shadow

- The color of the object should not modify the color of the shadow (it's the role of the <color> property of the effect)

 

Naturally, if you could provide options to change this behavior and provide more types of effects, it should be great!

Some of these modes may ignore the <color> property it's not a problem.

 

Also, I think <shadow-def> should be more usefull if it was described so :

  <length:spreadTickness[default=3px]>?

  <length:blurRadiant[default=3px]>?

  <length*length:offsetPoint(x,y)[default=0px 0px]>?

 

And box-shadow, so:

  //'?' is not usefull because it can empty.

  <shadow-def:shadowDef> 

 

  // The only one "must be defined" prop.

  <inner|outer:shadowPaintMode>

 

  // The shadow's color (object-color consider the colors of the obj.).

  <color|object-color:shadowColor[default=gray]>? 

 

  // The way the transparency is sent to shadow

  <keep|ignore:shadowOacityMode[default=keep]>?

 

  // The way the shadow is applied to the object

  // I've putted it but it must be discussed.

  <auto|below-object|beside-object|...:shadowMergeMode[default=auto]>?



Fremy

  From: Brad Kemper 
  Sent: Tuesday, May 13, 2008 6:54 PM
  To: Henrik Hansen 
  Cc: www-style@w3.org 
  Subject: [Bulk] Re: [css3-background] box-shadow syntax




  On May 13, 2008, at 5:56 AM, Henrik Hansen wrote:


    I've made, yet another, diagram explaining my idea down to the aboslute basics. (All shadows in the diagram is set to 50% opacity unless the point is it is changed.)
    http://img180.imageshack.us/my.php?image=shadowtrancemaskyq0.png

    Two columns one with the 'shadow-mask' and and one without.
    There are also four rows, each with a different value from 'shadow-transmittance'.
    Any comments on it now? Suggestions? Changes? Just write it.


  My feeling is that once you need to start dealing with non-rectangular shapes other than text, and with variable shadow strengths on a single element (masks) and color gel effects (transmittance), that you are going way beyond what most HTML authors would need. Perhaps it would be more appropriate for SVG, where there is more of a focus on the ability to do more complex renderings.


  I do think that being able to thicken or thin the shadow size without hacking the border (spread) would be more commonly used in HTML, as would being able to cast a shadow with a box as though the box was cut out of the surrounding area (inner/outer casting). As an author, I could easily see myself using those features (especially spread) very often. But they would still be a light weight effect to add a little dimensionality, not to try to recreate a photorealistic effect.


    ---

    Eli wrote:

      Which reminds me. It isn't clear whether border and padding (and margin?) get included in the calculation for how big the shadow is. Are UAs supposed to use 'width' and 'height'? (I expect so, but it needs to be asked.) 

    That's a good question! I'd say padding should effect the shadow. But margin? hmm, I could see reasons why, 


  Not me. Outer shadows should start at the outer edge of the border box and cast outward, and inner shadows should start at inner edge the border and cast inward. Here is another version of my mock-up, this time with borders, and with the shadows at 50% opacity:


  http://bradclicks.com/cssplay/Shadows2.html




    but also conditions where it's a problem. Borders should definitely be projected in the shadow, it would be weird if they didn't, because borders affect the surrounding elements it should also affect the shadow.
    But margins do that to! Hmm, anyone got some ideas?


    -Henrik