Tools and Downloads – Make the Web Faster — Google Developers

Tools and Downloads – Make the Web Faster — Google Developers There are many variables that affect a site’s performance. The tools listed below can help you discover those variables and improve your site. We recommend that you experiment with these tools. Multiple simple changes can improve the experience for your users around the world…

Putting CSS Clip to Work: Expanding Overlay Effect | Codrops

Putting CSS Clip to Work: Expanding Overlay Effect | Codrops A tutorial about how to create a simple expanding overlay effect using the CSS clip property and CSS transitions. VIEW DEMO DOWNLOAD SOURCE Our previous article, Understanding the CSS Clip Property by Hugo Giraudel offers a great overview of the CSS clip property and the rect() function. Today we…

3D Book Showcase | Codrops

3D Book Showcase | Codrops An experiment about a realistic looking book showcase with some interactivity using CSS 3D transforms. VIEW DEMO DOWNLOAD SOURCE Today we want to share an experimental book showcase concept with you. The idea is to make books look more realistic by using 3D transforms and apply some fun effects to them,…

7 Awesome Emmet HTML Time-Saving Tips | Design Shack

7 Awesome Emmet HTML Time-Saving Tips | Design Shack Emmet, formerly Zen Coding, is one of the most downright practical and productive text editor plugins that you will ever see. With its ability to instantly expand simple abbreviations into complex code snippets, Emmet makes you feel like a powerful coding wizard with the world at…

Responsive & Touch-Friendly Audio Player | Codrops

Responsive & Touch-Friendly Audio Player | Codrops A jQuery audio player plugin that is responsive and touch-friendly. The UI is css-only, no images used. VIEW DEMO DOWNLOAD SOURCE You know that feeling when you are in the design heaven of Photoshop (or another maybe not that overpriced app), then come to writing the markup and things…

StackSlider: A Fun 3D Image Slider | Codrops

StackSlider: A Fun 3D Image Slider | Codrops An experimental image slider that flips through images in 3D. Two stacks resemble image piles where images will be lifted off from and rotated to the center for viewing. VIEW DEMO DOWNLOAD SOURCE StackSlider is a highly experimental jQuery image slider plugin that explores a different and fun…

Tooltips are awesome, there’s simply no denying it. They provide a simple, predictable and straightforward way to provide your users with useful, context-sensitive information, and they look cool to boot. We all agree on how great tooltips are, but how we go about implementing them can differ dramatically. If you’re at square one, looking for…

Calendario: A Flexible Calendar Plugin | Codrops

Calendario: A Flexible Calendar Plugin | Codrops A jQuery calendar plugin for creating flexible calendars. VIEW DEMO DOWNLOAD SOURCE Today we want to share a flexible calendar concept with you. Calendars can be a very tricky thing when it comes to their layout and responsiveness. This is an experiment for trying out some grid layouts that…

Responsive Column Layouts

Responsive Column Layouts Typically, to create a column layout, you would need to add the first or last classes to reset the margin space and clear the float. Today I’m going to share a very simple CSS trick to create a responsive column layout using nth-of-type pseudo class. I use this trick to code the WordPress…