CSS - Cascading Style Sheets

Random 3D Explosions, 3D clouds – Effects with CSS 3D and jQuery

Introduction This tutorial will try to guide you through the steps to create a 3D-like, explosions in sky or billboard-based clouds. There are a few advanced topics, mainly how 3D transformations via CSS properties work. If you want to find more information, this is a nice place to begin. If you're in a hurry, just check the final result. The tutorial is divided into sections, each with a different step to understand and follow the process, with HTML, CSS and Javascript blocks. Each step is based on the previous one, and has a link to test the code. The code in the…
Continue Reading »
CSS - Cascading Style Sheets

CSS3 Transitions Effects on Background Gradients

CSS transitions do not have any effect on background gradients. As far as I know, the thing is that something similar would be quite difficult to achieve considering the multitude of possible gradients that can be created using a color palette. Though, there are some simple ways you can simulate smooth transitions on gradients and below you'll see how to do that. Before writing this article, I was thinking this new article will hopefully be more useful to you as It contains one more extra technique that can help you faking transitions on background gradients. So, what is this about…
Continue Reading »
CSS - Cascading Style Sheets

Creating CSS Starbursts Design with CSS3 Transform

Working with the new CSS3 rotation property I got that I could create image free starbursts. All I needed was a series of nested block-level elements each rotated by a slightly different amount. The rotation would distribute the box corners around the circumference of the star. About these CSS3 Starbursts: A good thing is if you create your starbursts with CSS3 you can do so much more than with images. You can experiment with different numbers of points/corners, rounded borders, resize, text-shadows and animations also. To see the animations you will need to use latest browsers like IE 9+, Firefox…
Continue Reading »