Lift Interactive offers a tactile CSS treat

Awesome CSS effects aplenty on Lift Interactive's new site

Canadian agency Lift Interactive has launched its new site, featuring tons of cool CSS effects. "We wanted to use our site to display both a new approach to how we want to communicate, but also to show what we are technically capable of," explains frontend developer Adrian Gyuricska.

Viewing the site in a modern, updated browser (Google Chrome is always a safe choice), be sure to scroll down to the Thinking area on the homepage and hover over the books. By transitioning CSS transforms and combining translate and rotate properties, the book front and spine have a nifty 3D effect.

Hovering over the books in the Thinking section reveals a cool 3D effect

“Something I enjoyed was the use of 3D transforms on the site. I’m really happy with the banner transforms on the homepage,” says Gyuricska.

More transforms are used on the Work page. Hovering over a thumbnail both scales and moves the image nested within the link, allowing the container to make a mask on the larger sized image, revealing more of it on hover.

Words: Jenn Lukas. This showcase was originally published in .net magazine issue 234.

Now read these!