Estudos

TwitterFacebook
Get flash to fully experience Pearltrees
Learn how to earn $125 or more per hour as a freelancer - Click Here Back just a few years ago it was required for web developers use JavaScript/jQuery to perform animated effects in-browser. CSS3 has dramatically changed the rules of the game where you can animate any standard property of an HTML element. This opens up a whole new room of effects you can put together in just 15-20 minutes of tinkering with code.

Using CSS3 Animations to Build a Sleek Box UI

http://designm.ag/tutorials/using-css3-animations-to-build-a-sleek-box-ui/

Learn HTML5 in 5 Minutes!

http://www.htmlgoodies.com/HTML5/client/learn-html5-in-5-minutes-.html#fbid=mjAtJXAWbGn written by Jennifer Marsman There's no question, HTML5 is a hot topic for developers. If you need a crash course to quickly understand the fundamentals of HTML5's functionality, you’re in the right place. In this tutorial, I’ll cover the new semantic markup, canvas for drawing and animation, audio and video support, and how to use HTML5 with older browsers. Might be a bit more than five minutes, but I promise I’ll keep it quick. Stick with me…it’ll be worth it!
http://css.dzone.com/articles/using-html5-create-charts-and

Using HTML5 to Create Charts and Graphs

Today I found an interesting library – flotr2: an opensource library for drawing HTML5 charts and graphs. It allows you to draw charts in different formats such as: lines bars candles pies bubbles Also, it doesn’t require any additional libraries such as jQuery or Prototype. And finally – it has good compatibility with different browsers. Here is our demo and a downloadable package:
http://css.dzone.com/articles/html5-image-effects-sepia

HTML5 Image Effects: Sepia

02. var canvas, ctx; 03. var imgObj;
001. var canvas, ctx; 002. var canvasWidth; 003. var canvasHeight; http://css.dzone.com/articles/html5-game-development-%E2%80%93-3

HTML5 Game Development – Lesson 8

http://dev.chetankjain.net/2011/12/minimal-required-code-in-html5.html I've encountered this question repeatedly of late. "What are the tags required at bare minimum for a html file?" <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <TITLE>A small HTML</TITLE> <P>Small HTML file!

The chetankjain dev Blog: Minimal required code in HTML5

Update: These context menus display even when JavaScript is disabled; so best practice will be to create these menu structures via JavaScript. Mass innerHTML injection can be used or basic DOM node injection. One of the hidden gems within the HTML5 spec is context menus . The HTML5 context menu spec allows developers to create custom context menus for given blocks within simple menu and menuitem elements. The menu information lives right within the page so there's no need to create a custom plugin . Let me show you how you can create your own custom context menus from basic HTML! http://davidwalsh.name/html5-context-menu

HTML5 Context Menus

Like many people today, we are exploring HTML 5 for use in web applications. While not really ready for prime-time on its own at this point, it can definitely be used in combination with tools like Modernizr ( www.Modernizr.com ). One of the first things you might do is create a home page with a simple navigation system on it. http://weblogs.asp.net/psheriff/archive/2012/03/03/an-html-5-navigation-screen.aspx

An HTML 5 Navigation Screen - Paul Sheriff's Blog for the Real World

http://www.script-tutorials.com/html5-image-effects-sepia/ HTML5 Image Effects – Sepia Today we continue our HTML5 canvas examples, today I want to share with you a method of applying a sepia effect to images. This is not a very difficult method, anyone can repeat it.

HTML5 Image Effects – Sepia

CSS: From Screen to Print and Beyond

Revolutionary for Web design, Cascading Style Sheets (CSS) have solved and continue to solve numerous challenges in designing for the continuous media of the Web. But what of paged media, as we want with our digital readers and printed collateral? Making websites and applications attractive and logical in paged media has been at best poorly achieved without the use of additional scripts and programming. Along with the many advances that CSS Level 3 (aka CSS3) has brought developers, two modules are on the horizon. Paged Media and Generated Content for Paged Media (GCPM) will allow the creation of paged media alongside existing websites. The combination of PM and GCPM is a powerhouse for the publication of far richer paged experiences. http://h30565.www3.hp.com/t5/Feature-Articles/CSS-From-Screen-to-Print-and-Beyond/ba-p/1752

Mac OS X Lion with CSS3

Hello everyone and Happy New Year to all, lately i've been busy and so i haven't time to write here, i hope that by this experiment to be pardoned :). I wanted to create with only use of CSS3 the boot, the login page and finally the desktop of the Mac OS X Lion. This is the first release and as you will see not everything is fully functional and at least as regards the desktop. In the next release i will implement new icons and new features while we examine what we have today.
001. .accordion { 002. color : #000000 ; 003. margin : 50px auto ; 004. position : relative ;

Pure CSS3 Accordion

How to optimize your CSS

Keeping your CSS files small and organized is very important, especially if you’re going to spend any time editing your site in the future, (or if others are gonna be using the code i.e. clients). Helpfully, there are a number of different techniques which can be utilized to aid organization and size of your CSS files in order to make them more streamline. Having more streamlined CSS will save you time and stress in the long run so it’s important to get it right. Firstly, keeping a single stylesheet, normally named style.css, is a good place to start in the organization of your CSS. Having a single stylesheet for the majority (if not all) of your website keeps everything together in one place which makes the editing process more streamlined.

Pure CSS3 LavaLamp Menu

001. #nav,#nav ul { 002. list-style : none outside none ;

Accordion with CSS3

Using hidden inputs and labels, we will create a CSS-only accordion that will animate the content areas on opening and closing. View demo Download source Today we’ll experiment some more with the adjacent and general sibling combinator and the :checked pseudo-class.