Profile

Cover photo
4,076 followers|23,011 views
AboutPostsPhotosVideos

Stream

WebKit

Shared publicly  - 
 
Timothy Horton landed support for the CSS4 Images cross-fade() function. It can be used as a value for any property that expects an image, such as background-image and border-image, and will render a cross faded combination of the two images (including gradients) given.

The syntax is as follows:

background-image: -webkit-cross-fade(
url("background.png"),
url("foreground.png"),
50%);

Other use-cases include tinting an image with a solid color, fading it out using a linear gradient or highlighting part of the image using a radial gradient.

WebKit's implementation is currently available in WebKit nightlies, and is not completely finished yet. Support for animating cross-fades is still pending, and it's likely that there still are bugs as well.

The commit: http://trac.webkit.org/changeset/100535
Specification: http://dev.w3.org/csswg/css4-images/Overview.src.html#cross-fade-function

WebKit nightlies: http://nightly.webkit.org/
Examples: http://peter.sh/files/examples/cross-fading.html
Changeset 100535. Timestamp: 11/16/2011 17:28:25 (17 hours ago); Author: timothy_horton@apple.com; Message: Implement CSS3 Images cross-fade() image function https://bugs.webkit.org/show_bug.cgi?id=52...
46
59
Manik Rathee's profile photoRichard Assar's profile photoNicola Zanon's profile photoAnthony Montemorano's profile photo
8 comments
 
There is no such thing as CSS4. There will never be a CSS4. https://plus.google.com/u/0/110977198681221304891/posts/8mRQaTPCTvo
Add a comment...
Have them in circles
4,076 people
Alexandre Oliveira's profile photo
Martin Michálek's profile photo
Agnès J Fauverge's profile photo
Nicolás Alarcón (Nico)'s profile photo
Erick España's profile photo
Md Saifuddin Sarker's profile photo
Thiago Raisel's profile photo
wabmax's profile photo
Joaquim Andrade's profile photo

WebKit

Shared publicly  - 
 
The rewritten implementation of the CSS Flexible Box Layout module has just been enabled! It doesn't only align WebKit much more accurately with the specification, but also delivers a lot more performance! +Ojan Vafai +Tony Chang

While not the entire specification has been implemented yet, it's definitely mature enough to replace the old implementation. Keep an eye out on http://webkit.org/b/62048 for updates on the missing features.

The commit: http://trac.webkit.org/changeset/100198
Specification: http://www.w3.org/TR/css3-flexbox/
15
36
Marcel Jackwerth (sirlantis)'s profile photoIan Beveridge's profile photoIstiaque Ahmed's profile photoYoel Kaseb's profile photo
2 comments
 
+Moshe Brevda This is all about the "old" flexbox module, not the rewritten one (which no-one, but webkit as of now, supports; even IE10 ships with support for the old version).
Compare http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/ and http://www.w3.org/TR/2011/WD-css3-flexbox-20110322/
Add a comment...
Story
Tagline
Unofficial page about WebKit, an open source web browser engine.
Introduction
WebKit is an open source web browser engine powering Apple Safari, Google Chrome, QtWebKit and WebKitGTK+ and is being developed by a wide range of companies including Apple, Google, KDE, Motorola, Nokia, RIM, Samsung, and the University of Szeged. This is an unofficial page curated by Peter Beverloo.