We're growing into something new. Read More
codrops

Mary Lou


Elastislide Revised

Elastislide is a responsive image carousel (jQuery plugin), now updated: http://goo.gl/uAgpi The carousel is liquid and will adapt to its parent container (in this case a percentage-based wrapper). It can be laid our horizontally or vertically and a minimal amount of visible images can be defined, meaning that if it's sized down, the images will automatically adapt to fit (especially useful when viewed on mobile devices). The photography used in this shot is from the Sin Street project by Andrey Yakovlev & Lili Aleeva: http://www.behance.net/gallery/Sin-Street/348615

Unfolding 3D Thumbnails Concept

Inspired by the current 3D trend we created this little 3D thumbnail view concept for image slideshows: the current image gets opened up and a thumbnail view unfolds in 3d. See it in action: http://tympanus.net/Development/Unfolding3DThumbnailsConcept/

Photo Booth Strips with Lightbox

In our latest tutorial I create some photo booth strips and integrate Lightbox 2, customize it and make it responsive. See the demo here: tympanus.net/Tutorials/PhotoBoothStripsLightbox/

Greeting Card Like 3D Flipping Circle

A new experiment with CSS 3D transforms. With a combination of circle parts, shadows and gradients, I was trying to make the flipping/opening movement look as realistic as possible. The inner image of Richard Feynman is supposed to look like translucent parchment paper... Here you can see a video (around 00:27) of Google Developer Stories from which I got this idea: html5rocks.com/en/tutorials/track/basics/ You can see a demo here: goo.gl/… and read the tutorial here: goo.gl/…

Old School Cassette Player

50 years ago the compact cassette was invented. This is a little experiment to honor this relict :) It's a HTML5 audio player with some semi-real controls for getting the feeling of how it was to use a tape and a player back in those times. You can find the demo here: tympanus.net/Development/CassettePlayer/ The cassette is by Mauricio Estrella: manicho.deviantart.com/art/…

Swatch Book with CSS3 & jQuery

I was experimenting with CSS-only things and although I, of course, love the fact that we can do so many awesome things with CSS3 without using any JavaScript, I'm not so sure if it's always a good idea :) However, this is another experiment but this time we added a bit of JS magic to set the rotations and open the swatches (CSS transitions and transforms are still used). You can view the demo here: Swatch Book with CSS3 & jQuery

Simple Content Carousel

Another simple carousel with jQuery. The theme has a touch of vintage and for the main headline I'm using the Rochester font. For the headlines in the content boxes I'm using the beautiful Coustard font (Ultra Bold). The carousel expands to a box and a respective content area when you click on "more...". In that view, one can navigate as well to the next/previous item, which will already be expanded. What you think?

Expanding Portfolio Template

This is another template for a grid portfolio that expands to full screen once clicking on "View Project". There is a little slider for each item that shows all the other thumbs of that project. This slider will get moved and positioned in the full screen view. Once in the full screen mode, we can navigate through all the projects, each one having a main representative image. The pictures are by Kyle van Horn. I'm using the "Oswald"font for the main headings: google.com/webfonts/specimen/… and "Ovo" for the & character: google.com/webfonts/specimen/…