This space-saving content filter allows the users to switch from one category to the other in a fancy way. Each click fires the rotation of the gallery images, revealing the items belonging to the selected category.
Meny is a three dimensional and space effecient menu. Meny works best in browsers with support for CSS 3D transforms, although it falls back on 2D animation for older browsers. Supports touch events for mobile devices.
Kontext is a context-shift transition inspired by iOS. It's created using JavaScript, CSS 3D transforms and CSS Animations.
A tutorial on how to re-create the page preloading effect seen on the website of Fontface Ninja. CSS animations, 3D transforms and SVGs used for this tutorial.
stroll.js is a collection of CSS list scroll effects. Works in browsers with support for CSS 3D transforms including a special touch-enabled mode for iOS & Android 4.x.
A framework for easily creating beautiful presentations using HTML. reveal.js comes with a broad range of features including nested slides, markdown contents, PDF export,speaker notes and a JavaScript API.
It's best viewed in a browser with support for CSS 3D transforms butfallbacks are available to make sure your presentation can still be viewed elsewhere.
A responsive Masonry grid with a gallery view using 3D Transforms. Based on the gallery seen on the Chromebook Getting Started guide by Google.
A tutorial on how to recreate the slideshow seen on the FWA landing page with 3D effects involving random animations.
Flip is jQuery/jQuery mobile plugin to give Flipboard app like effect. Flip effect uses css 3d transform.
Flip effect currently works on WebKit browsers (e.g. Chrome, Safari, including iOS mobile safari) or Firefox 11. It still works with other browsers but the "slide" effect will be selected forecely.
oriDomi is a JavaScript library for folding up any HTML element just like a paper. Oridomi has jQuery support and only works in modern browsers that support CSS 3D transforms.
oriDomi has touch support and works on iOS.
There are multiple effects provided: accordion, reveal, curl, collapse, ramp, foldUp, unfold and reset.
3D Image Gallery Room is an experimental image gallery with a realistic touch: the images are displayed in a 3D room with walls.
StackSlider is a highly experimental jQuery image slider plugin that explores a different and fun viewing concept for thumbnails, utilizing CSS 3D transforms and perspective.
The idea is to navigate through two piles of images where the transition resembles an item being lifted off from the top of the stack and moved/rotated to the center of the container to be viewed. The previously viewed image falls on the opposite stack.
PFold is a very experimental jQuery plugin that makes it possible to open elements in a paper-like unfolding effect. An element can be unfolded in 3D in order to reveal some other content. The idea is to have several levels of folding, where each step of opening will double the element size, hence imitating a folded paper being opened.
Windy is a jQuery plugin that allows a rapid navigation through a pile of items using some CSS 3D transforms and transitions. The effect of a continuous navigation flow reminds of a deck of cards or sheets flying away, hence the name.
Here you ll learn how to create a jQuery triple panel image slider with a 3D look.
The idea is to have a main panel and two lateral panels that are rotated slightly in 3D space. When navigating, you will slide in the respective next image in each panel. You'll be using CSS 3D Transforms with perspective and CSS Transitions.
