enable/disable button on scroll

enable/disable button on scroll

Hi room,

I saw the demo at flowplayer regarding scrollable images. http://flowplayer.org/tools/demos/scrollable/index.html
In this demo, the number of items is known and the buttons are either visible or hidden.  For my purposes, the number of items is unknown.

I need to disable a navigation button at the beginning and end of a scroll.  The scroll items are returned from a json file, so I have no idea how many will be returned -- but I want to show a prev button disabled at the beginning and a disabled next button at the end. Oh, and of course, during the scroll the buttons will be enabled as long as there are items.

Could someone help me code this?  I realize I need four images: btnPrevEnabled, btnPrevDisabled, btnNextEnabled, btnNextDisabled.

  1.     if(riGroup != 0 && null != riGroup){
            for(i = 0; i < riGroup.length; i++) {
                var rqGroupCounter;
                if(riSingle!= null) {
                    rqGroupCounter = riSingle.length + (i+1);
                } else {
                    rqGroupCounter = (i+1);
                }

                if ( riGroup.length >= 1){
                    displayRqdItems += '<div class="rqItmsGroup">' + '<fieldset>';
                    displayRqdItems += '<div class="itmsTitle">' + '<h5>please select one</h5>' + '<div class="numViewitm">' + '<div class="num">' + riGroup[i].prodDetails.length + '&nbsp;' + '</div>' + 'items to view' + '</div>' + '</div>';
                    displayRqdItems += '<div class="itmDisplay">';
                    //disable scroller if less than four items
                    if(riGroup[i].prodDetails.length < 4){
                        displayRqdItems += '<div class="scrollable">';
                    }
                    else if(riGroup[i].prodDetails.length > 3){
                        displayRqdItems += '<div id="scollerLead_' + i + '" class="scrollable">' + '<a class="browseLeft" onclick="btnPrevEnabled_' + i + '()"' + '>' + '<span>' + 'Left' + '</span>' + '</a>' + '<a class="browseRight" onclick="btnNextEnabled_' + i + '()"' + '>' + '<span>' + 'Right' + '</span>' + '</a>';
                    }





















Thanks,
Noah