eleqtriq

Liquify everything!

SVG Displacement Filter EffectA new article on smashing magazine, where I dive into the wonderful world of visual effects that can be achieved with displacement maps.

more

Finally! csswarp.js for dynamic Text warping

HTML text warpingFinally the first incarnation of csswarp.js is ready. Now it's possible to have warped text that follows a path even when content is served dynamically. An extensive set of configuration options gives you the ability to control every aspect of your warp.

more

Better CSS Sprites with SVG

gene

SVG CSS sprites offer some possibilities for webdevelopers that are superior to the "classical" CSS sprites. With SVG it is possible to get access to much needed properties like "background-rotation" or "background-opacity" that currently are missing from the CSS spec. This article shows how SVG can give us additional useful CSS tools for our frontend coding tasks.

more

Updated: traqball 2.0

traqball 2.0Finally updated traqball.js, my little js lib for gimbal lock free 3d rotation to version 2.0. Impress friends and family with deceleration, easier configuration and multiple trackballs on a webpage.

more

Fresh from the Lab: CSS3 Text-Warping

HTML text warping

My latest experiment: this little web application will make it easy for you to "warp" HTML-text. Create native text that follows the flow of an arbitrary bezier path or wrap it around a circle like you do in Illustrator.

more

Showcase: Pop-Up Book in HTML and CSS

Pop-up book

A little showcase, using all the latest CSS-stuff that makes CSS so much fun to work with these days: animations, transitions, transformations, 3D....

more

Natural Object-Rotation with CSS3 3D

CSS3 3D Object-Rotation

I finally found some time to finish the last part in my series on CSS3 3D tutorials. We will learn how to build and style a 3-dimensional packshot with noting more than a few lines of HTML/CSS and then add some Javascript-magic to make it a freely rotatable object. Works even on iPad and iPhone.

more

Introducing Spritebaker

Thumb

For some time now I had planned to build an online app that makes creating data URI-sprites in CSS less painful. As a special feature I wanted it to be pure HTML/Javascript...

more

CSS 3D Transforms verstehen (CSS 3D – 1)Understanding CSS 3D Transforms (CSS 3D – 1)

Thumb

Ich hatte die letzten Tage eine Menge Spaß dabei, mit CSS 3D-Transformationen herumzuspielen. Diese kleine Miniserie soll eine kurze Einführung sein für alle, die sich schonmal für das nächste Webkit-Update in Stellung bringen wollen.

Thumb

I had a lot of fun last week playing with the new CSS 3D Transforms. This short mini-series is intended to help developers get ready for the next generation of Webkit-browsers.

more