CloudCarousel: Rotating diagonally
A nice carousel effect with Javascript can be achieved with “Professor cloud’s cloudcarousel” (http://www.professorcloud.com/mainsite/carousel-test.htm), This carousel rotates in an ellipsis horizontally, by making a small change it is possible to rotate this carousel 45 degrees, so that it rotates diagonally.
First the maths, where I plotted an askew ellipsis with Wolfram | Alpha, as follows:
x= cos(t)cos(1.1)-sin(t)sin(1.1), y=0.5(cos(t)sin(1.1)-sin(t)cos(1.1))
Where 1.1 is the rotation in Radians, and the 0.5 determines how high
and low the carousel should rotate
To translate this into code, I edited the first few lines of the controller “class” as follows:
var Controller = function(container, images, options)
{
var items = [];
var funcSin = function(t){ return 2.2*(Math.cos(t)*Math.sin(2) – Math.sin(t)*Math.cos(2)) };
var funcCos = function(t){ return Math.cos(t)*Math.cos(2) – Math.sin(t)*Math.sin(2) };
var ctx=this;
