This weekend I’m hanging out at ConvergeSE in South Carolina, and I got a chance to catch up with my pal, Chris Coyier, of CSS Tricks fame. When you hang out with Chris you can’t help but learn something new, whether it be about CSS, browsers, or Bluegrass music. Right now, he’s working on a very nice redesign of his site that uses responsive web design in combination with CSS3 transitions. As with any responsive design, the layout changes as the browser window is resized, but when transitions are added on top of this, the layout changes animate smoothly.
I thought this was pretty nifty. Even though most users won’t resize a browser window to see a responsive design in action (or perhaps they will, I don’t know), it’s still a very nice touch of polish. After doing some more research, I discovered that Mr. Elliot Jay Stocks recently posted a fantastic article about CSS transitions and media queries that goes into more detail.
12 Comments
Comments are closed.
I even try to simplify my website. CSS3 is the best way to create cool animations, text or image effects. Instead of using Flash, CSS3 would be the best option. It keeps your website simple, easy and light. Keeping the point of SEO, your website won’t take too much time to load.
How to create the responsive web design?
http://couponuses.com/stores/jimmyjazz-coupons-jimmy-jazz-coupon-codes-jimmy-jazz-promotion-codes.html
As far as I’m aware there is no such software that supports development using HTML5 and CSS3.http://leanmusclexsite.net/
SMOOTHER AND FASTER in resizing as in ”reconditioning” of conditions and terms to suit new and newer applications.
Video! http://www.youtube.com/realcsstricks#p/a/u/1/1JRfHAPc53o
I’m not sure this is even close to the final design, but it’s been fun playing.
Couldn’t help but grunt weirdly as I watched this. Nghhhghhhffff. Mnnggh. Yes please.
Dude I could do that all day long. Just resizing the browser 😛
This article really needed an example, but I didn’t know where to look. Thanks, Chris! 🙂
Ooh! Now this sounds like an innovative use of CSS3 transitions and Media Queries. At our office, we’ve just had everyone read “Responsive Web Design” so this article (and the linked one) come at a very opportune time for me and the rest of my coworkers 😉 Thanks for posting it!
Thank i realy helpful to read this post and we also apply that process in our web site like http://www.toprankexpress.com
and http://www.brandwebdirect.com
CSS3 animations, combined with responsive web design? Wow! There is also a good article about CSS Animations at here. I think the future of web is revolutionary. We’re all waiting Mr. CSS-Tricks! Hurry up with you new design.