Marquee jQuery Plug-in Released!

Categories: jQuery

My current employer (Giva, Inc) has released another jQuery plug-in today called the Marquee jQuery Plug-in. The jQuery Marquee plug-in converts a list element (<ul /> or <ol />) into an ESPN-style scrolling marquee. Messages are scrolled in from top or bottom (based on the yScroll option) and longer messages will then ticker to the left in order to show the full message.

The Marquee jQuery Plug-in has an example you can look at or you can see several different marquees in different configurations on the Giva Labs - Marquee Example Page.

Dan - May 20, 2009 @ 3:43 PM Bookmark/Share Link 4192 Views Print Comments (13)

Comments

Phillip Senn's Gravatar Sweet!
Phillip Senn - May 20, 2009 @ 3:56 PM
Rob's Gravatar Hey Dan,
After looking for a marquee plugin like this for a few months, I've just stumbled across yours and love it!

Is there a way to cycle through the list using a "Next" and "Previous" button of some sort?

I'm looking to replicate the marquee effect on the BBC news website.

Great work!
Rob - Aug 25, 2009 @ 9:42 AM
Dan G. Switzer, II's Gravatar @Rob:

There is no next/previous functionality exposed. You could pretty easily expose the showNext() function by adding something like:

this.next = function (){
showNext();
}

To the code. You could hack the showNext() function to allow you to advance backwards/forwards through the messages.

If you get your mods working, let me know and I'll look at adding it to the codebase!
Dan G. Switzer, II - Aug 25, 2009 @ 10:41 AM
Andres's Gravatar Thanks for this code. This code help me so much.
Andres - Aug 26, 2009 @ 12:00 PM
John karmak's Gravatar Hi, very fine work.

I tried start using it with jquery 1.3.2 but it doesn't work.
Then i tried with 1.2.6 and it work as from plans.

It is already perfect, but can tou make it work with 1.3.2?
As 1.3.2 ha better performance then 1.3.0 and 1.3.0 better than 1.2.6.

Thanks a lot.
John karmak - Sep 3, 2009 @ 9:54 AM
Dan G. Switzer, II's Gravatar @John:

The plug-in works fine with v1.3.2. The example page is using v1.3.2:
http://www.givainc.com/labs/marquee_example.htm

There are several changes in jQuery's selector engine, so perhaps the problem is actual with the selectors you're using. The plug-in definitely does work with v1.3.2 as you can see from the example page.
Dan G. Switzer, II - Sep 3, 2009 @ 10:24 AM
John Karmak's Gravatar You are right!
I reset the 1.3.2 and now it works perfectly.
I don' know what happened before.

Great thanks. Supercool work!
John Karmak - Sep 4, 2009 @ 2:22 AM
Dan G. Switzer, II's Gravatar @John:

Glad you got it working!
Dan G. Switzer, II - Sep 4, 2009 @ 8:43 AM
Amy's Gravatar Is there any way to center the text in the marquee?
Amy - Oct 20, 2009 @ 2:03 PM
Dan G. Switzer, II's Gravatar @Amy:

If you gave the "ul.marquee li" CSS an explicit width, you could use the "text-align: center" declaration to center the text.

However, this will only work with short messages that aren't longer than the UL.
Dan G. Switzer, II - Oct 20, 2009 @ 3:00 PM
Amy's Gravatar Thank you Dan!!!
Amy - Oct 20, 2009 @ 3:12 PM
Dan Price's Gravatar Hey Dan,
Is there a way to show more than one <li> at a time.

E.g. it shows
<li>news item 1</li>
<li>new item 2</li>
then it scrolls on and shows the next two:
<li>news item 3</li>
<li>news item 4</li>

Many thanks :-)
Dan Price - Mar 11, 2010 @ 6:18 AM
Dan G. Switzer, II's Gravatar @Dan:

No, it's designed to show just one item at a time. There are other scrolling plug-ins designed for showing multiple items. This particular plug-in doesn't lend itself to multiple lines because of the varying length of lines and the way the scrolling occurs.
Dan G. Switzer, II - Mar 11, 2010 @ 8:10 AM

Add Comment

Leave this field empty


If you subscribe, any new posts to this thread will be sent to your email address.