Not being much of a mathophile, the prospect of creating sine/cosine generated carousels fills me with dread. In fact, trig and matrices have always been the bane of my professional life and I usually try to avoid them. I’m more than happy banging out algorithms for scrollbars, dynamically resizing layouts and have even drawn the odd curve here and there, but I just never really got comfortable with angles. It’s not something that I absolutely cannot do – rather I prefer to leave to those who are either interested in it or good at it.. either way, the site looks better for it and the client gets a better result. 😉
In this case, I didn’t have that option, so I cranked the hack up to 11 and got trawling the net for carousel code! I think the end result was pretty cool – I even got in a startup animation that spins the carousel to stop evenly at a random university. In this case, the tricky part was in the fact that to keep processing down and to maintain a level of separation between the images in the carousel, I had to keep a fixed number of items on the carousel itself and, depending on the direction of rotation, swap out items as they passed through the rear-most point of the ellipse. This gave the impression that the carousel held many more items than were actually visible, whilst maintaining the overall shape and performance of the spin.