Peek

Mini CSS3 photos

by Drew McLellan Feb 3, 2010
Screen-shot-2010-02-03-at-14
Tweet
246 views
http://drbl.in/bZx
Icon-colordrop

4 Responses

  1. Peek Drew McLellan

    This was the demo for my original 24ways article for this year. Turned out @natbat had the same idea, so I switched at the last minute and covered RGBA instead.

    I still like this and think I might use it on my blog.

    over 2 years ago

  2. Jasonrobb Jason Robb

    That's awesome.

    over 2 years ago

  3. Pro Me Anthony Killeen

    This does look nice Drew! Different (random?) box shadows settings would help convey the depth of the photos laying on top of each other, but doubt this is possible without specific classes on each photo.

    Defintely glad you ran with the RGBA article - one of my faves of the series.

    over 2 years ago

  4. Peek Drew McLellan

    I'm using CSS :nth-child selectors to give alternate photos a different angle, and then using JavaScript on top to jiggle them to a completely random angle.

    On hover they rise to the top, twist slightly, and the shadow distance increases so they look like they're being lifted away from the surface onto which the shadow is cast. I'm useless at this arty stuff, but it appears to work.

    Here's the demo: http://drewmclellan.net/code/thumbs/test.html

    over 2 years ago

keyboard shortcuts: ← previous shot → next shot L or F like