Skip to content

Instantly share code, notes, and snippets.

Rotating 3D Slider

Sourse of inspiration - http://rdcm.com/en/

Slider not working in IE, because of transform-style: preserve-3d. Handle control is broken in FF during rotation, because FF still have this nasty bug with stacking context and translateZ, and it's simply breaks z-index order for elements.

I tried to create this slider as sort of plugin/component. It's more like a practice, so js architecture is pretty random. But it's working :) And you can use multiple sliders on page with different sizes and different settings (you can find options object in js).

Don't forget to rotate slides with control handle.