Carousel widget made for TW frontpage

1. module width may be flexible but carousel conatiner width needs to be fixed.
2. control buttons are generated from JS
3. JS counts position based on item offsetwidth; this widget should be initialized after items are present on stage
4. orignal YUI carousel lib was too big for frontpage and doesn't cover exactly what we need. the tw carousel js only contains necessary functions and is about 3k after jsMin.
5. to init: new carousel(moduleId_or_moduleObject [,configobject])

date: 2007

configobject

oConf : { currentpage : 1, // current page, default to first page containerclass : 'ycarousel-container', // the carousel itself ulclassname : 'ycarousel-list', // the carousel list classname handleclassname : 'ycarousel-handler', // the handler container classname controldiv : 'control-container', // the outside layer of bottom control buttons controlbtn : 'btncontrol', // the display table layer of bottom control buttons prevbtnclass : 'btnprev', // generated previous button nextbtnclass : 'btnnext', // generated next button arrowoffclass : 'off', // disabled previous and next buton classname dotonclass: 'on', // current page indicator classname of buttom control buttons }

html structure

<div id="whatever"> <div class="ycarousel-container"> <div class="ycarousel"> <ul class="ycarousel-list"><li> whatever content </li>..</ul> </div> <div class="ycarousel-handler"></div> </div> </div>

how it's initialized in this demo

var yCarousel1 = new carousel('carousel-1',{'ulclassname':'carouselist'}); var oCarousel2 = YAHOO.util.Dom.getElementsByClassName('ycarousel-container','div','demo')[1]; var yCarousel2 = new carousel(oCarousel2);