WebAppers

/ best free open source web resources /

Shopify

Interactive Photo Desk with jQuery and CSS3

Posted · Category: Gallery, License Free

Codrops has created an Interactive Photo Desk with jQuery and CSS3 that provides some “realistic” interaction possibilities for the user. The idea is to have some photos on a surface that can be dragged and dropped, stacked and deleted, each action resembling the real world act.

If we drag a picture, it get’s “picked up” first, making it appear a little bit bigger. Dropping it results in the picture being “thrown back” to the table, in a random rotation. Viewing all photos mirrors the action of collecting all images into a pile and viewing the first one in a none rotated way. Clicking to see the next one then, makes the previous one being thrown back to the surface. Deleting an image will make it appear as a crumpled paper ball. When using the shuffle function, the photos get rotated and spread over the desk randomly.

interactive-photo-desk

Requirements: jQuery Framework & CSS3
Demo: http://tympanus.net/Development/PhotoDesk/
License: License Free

3 Comments
  • Naki

    That’s pretty impressive!! Thanks for the link!

  • Brian Scott

    A tutorial covering this would be greatly appreciated.

  • Anonymous

    It’s definitely cool but what’s the practical use for something like this? In my opinion there is none.

Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons