A jQuery plugin for 360 image rotations. Use a vertical/horizontal spritesheet (recommending Sprite Factory) as a background-image on an element, call the plugin on the element, and magic happens. Much <3
to Aaron Bohenick for cat statue renders~
dragAxis
takes either a string ofx
ory
indicating the axis in which the mouse drag should trigger a sprite change (default:'x'
)spriteDim
takes an object with anx
andy
property of the dimensions of a single spritespriteSheetDim
takes an object with anx
andy
property of the dimensions of the entire imagesensitivity
a number of how many pixels a drag has to move to trigger the next frame of the animation (default:3
)
<div class="threesixty" style="height:390px; width:280px; background-image: url(360.jpg);"></div>
<script>
$('.threesixty').threesixty({
dragAxis: 'x',
spriteDim: { x: 280, y: 390 },
spriteSheetDim: { x: 280, y: 15600 }
sensitivity: 3
});
</script>
This project uses smoosh for compiling, linting.