Kenburns slideshow

Image slider using the Ken Burns effect. Highly customizable. You're able to set:

  • duration
  • zoom level (from, to)
  • start point
  • end point
  • size of the viewer

You're able to choose individual images, but also sets.
demo
http://www.missmarvels.nl/kenburns
credits:
Tobia Conforto (CrossSlide)
http://www.gruppo4.com/~tobia/cross-slide.shtml
thnx Tobia

 

A qoute on performance and the possibility to choppiness:

" jQuery animation effects rely on the browser for positioning, scaling and cropping images, through CSS and the DOM. Thus it depends heavily on how the browser and the underlying graphics platform optimize these operations. Compared to native implementations of the same effects, CrossSlide is quite CPU-intensive, but recent hardware handles a moderate usage without problems.

Some browsers on some platforms apply a nice anti-alias filter to images when you use a zoom factor in the Ken Burns mode, but most don't. Therefore I recommend keeping your zoom factors below 1x, in order to avoid ugly 'pixel mosaic' effects. You can tell that I didn't follow my own advice in this very site by the ugly pixel noise in the Ken Burns examples above.

It also bears to mention that CSS and DOM force a script to round position and size of images to integer pixel values, for every frame of an animation, not just keyframes. This effectively makes it impossible to achieve slow, smooth animations. If you are experiencing this issue, my only advice is to either make the animation faster, do away with diagonal panning and/or image zooming, or switch to a different animation technology."

 

Version 1.2.1 has the latest release of cross-slider

Also it's possible to add an url for the custom slider. The url will open in the current window by default.

Open in new window by using 

javascript:open(\'http://www.google.com\')

MARK the escape for quote

Approved by PRB

Our 30 Day Support Policy

  • Replies to tickets every few days.

Also Check Out