Inspired by Andrew Sellick's Simple 3D Carousel using Mootools I needed a jQuery version of the script, source code of which is below (tested with jQuery 1.4).
Please refer to the original tutorial for instructions and a working demo.
var count = 0;
var baseSpeed = 0.05;
var radiusX = 190;
var radiusY = 40;
var centerX = 300;
var centerY = 190;
var speed = 0.3;
var imageDivs = '';
var numberOfElements = 0;
var carousel = '';
var speedTest = '';
$(document).ready(function(){
carousel = $('#carousel');
imageDivs = $('#carousel div');
numberOfElements = imageDivs.length;
setInterval('startCarousel()', 40);
carousel.mousemove(function(event) {
tempX = event.clientX;
speed = (tempX - centerX) / 2500;
});
});
function startCarousel(){
for(i=0; i < numberOfElements; i++){
angle = i * ( Math.PI * 2 ) / numberOfElements;
posX = ( Math.sin( count * ( baseSpeed * speed ) + angle )* radiusX + centerX );
posY = ( Math.cos( count * ( baseSpeed * speed ) + angle )* radiusY + centerY );
imageDivWidth = posY/3;
imageDivZIndex = Math.round(imageDivWidth)+100;
$('#carousel div').eq(i).css({'position': 'absolute', 'left': posX + 'px', 'top': posY + 'px', 'width': imageDivWidth + 'px', 'zIndex': imageDivZIndex});
angle += speed;
}
count++;
}