YUI Carousel Only Showing One Row When I Want Two!

I fought with this issue all afternoon. I was setting up my carousel like this:


var carousel = new YAHOO.widget.Carousel("container");
carousel.set("numVisible", [5,2]);

But no matter how hard I tried. I couldn’t get it to show me more than one row. Over and over I fiddled with widths and heights and borders and padding but no luck. Finally, I took the example from the YUI Library Example Page and copied and pasted the HTML line by line into my page. When I got finished, the example was broken too!  So, what to do?

I wandered down to my javascript and compared it to the example one. The example passed in the columns and rows during the creation of the Carousel object and I was setting the variable right after I created it. Aha. So, I changed my two lines of code to this:


carousel = new YAHOO.widget.Carousel("container", {
// specify number of columns and number of rows
numVisible: [6, 4]
});

And everything is now working. Time for a pint.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s