Thanks Mike - that's awesome!
I am using it with text and the borders of the internal items aren't
quite being maintained on the right side of the scrolling container.
My code is below for you too look at.
Also how could one decide if forward was scroll left or right when
using timeout:5000? I had to change my next and prev buttons to be the
other way around to line up with the timeout direction.
<div style="width:200px;">
<h3>Featured News</h3>
<div id="newsTicker"
style="height:110px;width:210px;margin:0px;padding:0px;border:1px
solid #000000;background:#eeeeee;position:relative">
<div style="height:90px;width:190px;margin:5px;padding:5px;background:#ffffff;">
<h4><a href="/news/news-2a/" title="Read the article: News 2a">News
2a</a> - Sunday, May 6</h4>
Text <a href="/news/news-2a/" title="Read the article: News
2a">More...</a>
</div>
<div style="height:90px;width:190px;margin:5px;padding:5px;background:#ffffff;">
<h4><a href="/news/url-rewriting-in-cms-base-yo/" title="Read the
article: URL Rewriting in CMS Base, yo.">URL Rewriting in CMS Base,
yo.</a> - Thursday, April 26</h4>
CMS Base? More like CMS Ace. <a
href="/news/url-rewriting-in-cms-base-yo/" title="Read the article:
URL Rewriting in CMS Base, yo.">More...</a>
</div>
</div>
<div>
<div id="prevNews" style="float:left;"><a href=""><< Prev</a></div>
<div id="nextNews" style="float:right;"><a href="">Next >></a></div>
</div>
</div>
<script>
$(document).ready(function(){
$('#newsTicker').cycle({
fx: 'scrollHorz',
pause: 0,
timeout: 5000,
next: '#prevNews',
prev: '#nextNews'
});
});
</script>