views:

289

answers:

1

Hi - I am having issues with jquery.serialScroll not working in my case.

I have a div id=ticker which basically works like a scrolling ticker. something like this - http://www.tinymassive.com/ (whats happening section). So i am prepending dynamic content to div id=ticker, and i want scrolling animation from top-to-bottom as shown in the link.

$('#ticker').serialScroll({ items:'div', duration:50000, force:false, axis:'y', easing:'linear', lazy:true, interval:1, step:2 });

Dont think the above code is working, even if i comment i see no change in the behavior.

The div id=ticker is contained in another div which is contained in another div, basically think of it like 4-5 level tree like structure

body -> div[id=wrapper] -> div[class=main] -> div[class=content] -> div[class=frame] -> div[class=bg] -> div[class=primary-content] -> div[id=ticker]

Heres the css...

wrapper {

width: 942px; margin: 0 auto; position:relative; overflow:hidden; }

.main{ width:942px; margin:163px 0 0; overflow:hidden; }

.content{ background:url(../images/content-bg.gif) repeat-y; overflow:hidden; width:662px; float:left; }

.frame{ background:url(../images/frame-bg.gif) no-repeat 0 0; width:662px; }

.bg{ background:url(../images/bg-bg.gif) no-repeat 0 100%; width:662px; overflow:hidden; } .primary-content{ padding: 12px 20px 40px 22px; width:620px; overflow:hidden; }

ticker {

overflow: hidden;

}

Also if it helps - the ticker div contains a list of div[class=breadcrumps], which i am trying to scroll

.breadcrumbs{ border-bottom:1px solid #ebebeb; padding:6px 0 6px 0; overflow:hidden; clear:both; }

What i see is - i see the items getting prepended, but dont see the animation/effects. In fact the .serialScroll does not seem to have any affect at all.

I have included the following js files. - jquery.serialScroll-1.2.2-min.js - jquery.scrollTo-1.4.2-min.js - and obviously jquery 142

Any help would be appreciated.

Thanks.