guess who?!

Demo for Wee Marquee

Wee! Yet another marquee jQuery plugin! So, this creates a marquee like Twitter's homepage, but also accounts for the case when the length of the content is less than the width of the marquee viewport (check the first example below).

This is a poor single marquee.

This is a selection of scrolling text which exceeds the width of this container. This means it will be duplicating itself. Weee! <end>

This has no fade effect for minimalists.

Why?

I am learning to use jQuery and I figured creating code would be more useful than studying it. Plus this way, one of you might get frustrated enough to correct it or suggest something better. Either way, I win!

Supported Browsers

It should work on all browsers including IE6. But it only has been tested on Opera 10.5+, Firefox 3.6+, Safari 4+, Chrome. Do report bugs, if it does not.

Gimme Code!

1. Get the CSS

   This is the CSS you need for the plugin to work.

   If you don't copy the CSS to your main stylesheet, a raptor will be automatically dispatched to eat you.

2. Get the JS

   Download the Javascript file and link to it (preferably before the closing body tag).

3. Call it!

   $(".scroller").weemarquee();

4. Options

   You can call it using the following options:

   • interval - defaults to 20, The greater the interval, the slower the marquee will be.
   • fade - defaults to true, if you do not want the fade on the sides, set it to false.
   • width - set the width of the marquee viewport, defaults to 400px.
   • skin - adds a class to the marquee container so you can style it as you wish. Default class name is wm-base.

   Usage: $(".scroller").weemarquee({ fade: false, width: 300 })

I wanna improve it!

Thank you Opensorcerers, fork it on github and improve it as you wish!