How to make an image slideshow with JSF?

Is it possible? If the answer is no, any other ideas?

The list of pictures is dynamic, it depends on what user you're viewing. How can I make a slideshow with the images that user uploaded?

Now it's working this way: A single picture is displayed and you need to close it to open the next one.

<rich:dataGrid  id="albumGrid" value="#{someBean.pictures}" var="item" columns="4" elements="4" width="450px" rendered="#{not empty someBean.pictures}" style="margin-left:20px;">

                <a4j:commandLink id="fullLinkProfile">
                    <a4j:actionparam name="pic" v开发者_如何学运维alue="#{item.path}" assignTo="#{picsBean.path}" />
                    <h:graphicImage value="/home/pictures/user/#{item.path}" rendered="#{item.path != null}"/>
                </a4j:commandLink>
                <f:facet name="footer">
                    <rich:datascroller for="albumGrid" boundaryControls="hide" stepControls="show"  fastControls="hide" >                       
                    </rich:datascroller>
                </f:facet>              

</rich:dataGrid>

Use any javascript slideshow function and pass bean value argument to it which has comma(,) seperated values of image paths.

Using jQuery will give you best effects.

Also check this.

Use following function to create your html code passing bean value and then integrate with any of jQuery plugin.

function loadImage(imgPaths)
{
    var images = imgPaths;
    var imgArr=images.split(",");
    var ulobj=document.getElementById("parentDiv");
    var i;
    var len =imagePath_array.length-1;
    for(i=0;i<len;i++)
    {
        var imgObj=document.createElement("img");
        var liObj=document.createElement("li");
        imgObj.src=imgArr[i];
        liObj.appendChild(imgObj);
        ulobj.appendChild(liObj);
    }
}