Not tested this yet, but the code would need to be tweaked. Change
el.items = $("li", el); to el.items = $("> li", el); And then use lists within lists: <ul id="news"> <li><ul> <li>News 1</li> ... <li>News 10</li> </ul></li> <li><ul> <li>News 11</li> ... <li>News 20</li> </ul></li> </ul> Hope this helps. -- Sam On Oct 10, 10:44 am, RDB <[EMAIL PROTECTED]> wrote: > Hello, > I’m using Newsticker (http://www.texotela.co.uk) in my site, I would > like to know how to show multiple news per each screen instead of only > one in this plugin. > I'd like to show 10 news by 10 because of their big number. > Any idea on how to make this ? > > Thanks a lot > > Jquery code : > ------------------------------------ > <script type="text/javascript"> > > (function($) { > /* > * A basic news ticker. > * > * @name newsticker (or newsTicker) > * @param delay Delay (in milliseconds) between iterations. > Default 4 seconds (4000ms) > * @author Sam Collett (http://www.texotela.co.uk) > * @example $("#news").newsticker(); // or $ > ("#news").newsTicker(5000); > * > */ > $.fn.newsTicker = $.fn.newsticker = function(delay) > { > delay = delay || 4000; > initTicker = function(el) > { > stopTicker(el); > el.items = $("li", el); > // hide all items (except first one) > el.items.not(":eq(0)").hide().end(); > // current item > el.currentitem = 0; > startTicker(el); > }; > startTicker = function(el) > { > el.tickfn = setInterval(function() { doTick(el) }, delay) > }; > stopTicker = function(el) > { > clearInterval(el.tickfn); > }; > pauseTicker = function(el) > { > el.pause = true; > }; > resumeTicker = function(el) > { > el.pause = false; > }; > doTick = function(el) > { > // don't run if paused > if(el.pause) return; > // pause until animation has finished > el.pause = true; > // hide current item > $(el.items[el.currentitem]).fadeOut("slow", > function() > { > $(this).hide(); > // move to next item and show > el.currentitem = ++el.currentitem % > (el.items.size()); > $(el.items[el.currentitem]).fadeIn("slow", > function() > { > el.pause = false; > } > ); > } > ); > }; > this.each( > function() > { > if(this.nodeName.toLowerCase()!= "ul") return; > initTicker(this); > } > ) > .addClass("newsticker") > .hover( > function() > { > // pause if hovered over > pauseTicker(this); > }, > function() > { > // resume when not hovered over > resumeTicker(this); > } > ); > return this; > > }; > })(jQuery); > > $(document).ready( > function() > { > $("#news").newsTicker(2000); > } > ); > > </script> > > ------------------------------------ > > HTML code : > > <!-- Begin HTML code --> > <ul id="news"> > <li>first news</li> > <li>second news</li> > <li>third news</li> > <li>...</li> > <li>50th news</li> > </ul> > <!-- end HTML code -->