RE: Mirror as background property

Tab Atkins Jr. wrote:
| Better would be to do that with Webkit's support for reflections
| through -webkit-box-reflect.  I think they plan on speccing that?

Ah, yes, like box-shadow it doesn't affect flow. Neglected to look it up when mentioned. It takes an image or a gradient mask. Yes, that should render my example. The only background-flip capability lacking would be something like an 'extent' value (default 100%), where the reflected image can be compressed or expanded in the direction of reflection.

I think box-reflect would be more useful if, rather than a gradient or image mask, it included start and end transparency stops for the reflected image. It could then 'reflect' on any background and have underlying background-images showing through. That would be an improvement over the background-flip method. As I understand the -webkit-box-reflect() spec, you'd still need to create a PNG with transparency (potentially much larger than the original image) for that effect.

David Perrell

Received on Sunday, 30 August 2009 19:04:16 UTC