Store Code Cs Category Code M

Creating Animated 3D Popping Text in CSS3

This bit of code that I recently discovered belongs in the category of, “Really Cool Stuff That I Have Yet to Find a Real Use For.” Yes, that is a long title for a category that exists only in my mind, but for what I’m about to show you, it’s very apropos. Basically, this CSS3 code allows you to create animated text that literally pops off the page. You might find it useful for when you use text for your logo (as compared to using an image) that’s not mixed within a paragraph. However you choose to use it, it’s sure to grab the interest of your visitors.

The code consists of three parts. Two parts belong in your CSS and the third part is in your HTM file. The above code starts by defining the color of the font, font family, size and the weight. A bold attribute was added to increase the effect of the 3D transition. Next, the code defines the text’s shadow and the positioning of the shadow, along with the color. This bit of code is where you can experiment with where you want the shadow to appear around the letters and the color of the shadow. Don’t forget to add in the position element, or there will be problems with the animation. The last few lines of the code are vendor-specific, which means this 3D animation affect will not work on all browsers. For Internet Explorer, you’ll get the pop effect, but you won’t see the colors.

Journal of the Audio Engineering Society

Foundation Dreamweaver MX

Artistic Web Design Using Adobe Dreamweaver & Photoshop, An Introduction

Macromedia Dreamweaver MX 2004, web application recipes

Multidisciplinary approaches to code switching