W3C home > Mailing lists > Public > www-style@w3.org > November 2013

Re: [css-images] element() image use cases

From: Alan Gresley <alan@css-class.com>
Date: Fri, 15 Nov 2013 14:42:33 +1100
Message-ID: <52859829.3040504@css-class.com>
To: Dirk Schulze <dschulze@adobe.com>, www-style list <www-style@w3.org>
On 14/11/2013 1:44 PM, Alan Gresley wrote:

> This could be used as a
> basic cross fade where one image goes from opacity 1 to 0 and the
> other image goes from opacity 0 to 1.

Another example using element() as a background while independently 
animating opacity for each image.

http://css-class.com/test/css/3/image/element-cross-fade2.htm

This could be done another way by using nested img tags that are 
absolutely positioned for something like a header region of a page but 
if there are also HTML headers (e.g. h1, h2, ..), these need to be 
absolutely positioned as well. You generally don't want to use 
absolutely positioned elements since this creates a new staking context 
and in effect are not backgrounds with there own background layers.

Another example but with transformed elements.

http://css-class.com/test/css/3/image/element-cross-fade-transform.htm


Alan





-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/
Received on Friday, 15 November 2013 03:43:01 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:37 UTC