SineScroller - jQuery Plugin for Wave Scrolling

jquery.sinescroller.js is a jQuery plugin which allows scrolling a line of text along a sine curve (i.e. make a wavy text scroller, with each letter following a sine and rotating accordingly).

Remember the old days of demoscene and this staple effect?

Now you can have it on your website!

This is an unusual and interesting way to present a scrolling text on the web and attract your visitors. Useful for all sorts of advertising messages, promotions, exclamation texts and banners. The string can be also be just statically laid out and not animated for an exciting header or a curious sidebar subtitle. It’s also possible to animate in place. The string will wiggle without actually scrolling.

All parameters of the sine are curve as well as the animation are settable and controlled with a couple of variables. The plugin provides sensible default to get you started right away.

Font settings as well as the text to scroll are taken from the containing element, thus allowing very easy control and multiple scrollers on the same page.

Canvas support in the browser is required. If not existing, the plugin silently exits and leaves the original text untouched, so a direct fallback mechanism is achieved in a clean way.


  • basic scrolling along a sine curve
  • waving in place
  • static text possible by disabling animation
  • all sine variables settable
  • control over various animation parameters
  • phase shifting while text is scrolling for even more interesting effects
  • run/stop functions available for calling from javascript