Drawing arbitrary elements as backgrounds with -moz-element

  • Tom Kenny

Very interesting and innovative new CSS background implementation proposed by Mozilla for use in Firefox 4. Basically you can use any element via it’s ID as easily as this:

background: -moz-element(#yourelement);

It works with any HTML element even <iframe> or <video>. Make sure you download the Firefox 4 Beta and check out some of the demos, especially the animated water ripple reflection and the video demo. Both demos are probably a little over the top but certainly demonstrate the implementation effectively. Hopefully other browsers will pick this up and implement it too.

Source: http://hacks.mozilla.org/2010/08/mozelement/

Coming Soon...

The Learn from Great Design Volume 1 eBook


The bad news is it isn't ready yet but the good news is you can get three case studies for free, right now. Simply sign up and I will send it to you immediately. People subscribed to the email newsletter also get a discount on the book when it's released.

The book will contain 20 LFGD case studies (I spend at least 5 hours on each one) but there will be another version of the book with even more studies and at least 3 masterclasses, with even more in-depth studies of great design. One of them is the travel giant Airbnb.

Sign up below to get notified of the launch.

Free. No spam. Unsubscribe any time.