Hi all,

I have a fading image carousel (code below) where it pulls the images from my umbraco field image1 etc, i want it to also display a title for each image also pulled from a umbraco field (title1) but am struggling!

Anyone have any suggestions??

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE xsl:stylesheet [
        <!ENTITY nbsp "&#x00A0;">
]>
<xsl:stylesheet
        version="1.0"
        xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
        xmlns:msxml="urn:schemas-microsoft-com:xslt"
        xmlns:umbraco.library="urn:umbraco.library"
        exclude-result-prefixes="msxml umbraco.library">
        <xsl:output method="xml" omit-xml-declaration="yes"/>

        <xsl:param name="currentPage"/>

        <xsl:template match="/">
                <xsl:apply-templates select="$currentPage" />
        </xsl:template>

        <xsl:template match="*" />

        <xsl:template match="WidgetFadeImageCarousel">
                <script type="text/javascript">
                        jQuery.PictureSlides.set({
                                // Switches to decide what features to use
                                useFadingIn : true,
                                useFadingOut : true,
                                useFadeWhenNotSlideshow : true,
                                useFadeForSlideshow : true,
                                useDimBackgroundForSlideshow : false,
                                loopSlideshow : true,
                                usePreloading : true,
                                useAltAsTooltip : true,
                                useTextAsTooltip : false,

                                // Fading settings
                                fadeTime : 500, // Milliseconds
                                timeForSlideInSlideshow : 2000, // Milliseconds

                                // At page load
                                startIndex : 1,
                                startSlideShowFromBeginning : true,
                                startSlideshowAtLoad : true,
                                dimBackgroundAtLoad : false,

                                // Large images to use and thumbnail settings
                                images : [
 <xsl:for-each select="umbraco.library:Split('image1,image2,image3,image4,image5,image6,image7,image8,image9,image10', ',')/value"> <xsl:variable name="value" select="text()" /> <xsl:if test="normalize-space($currentPage/*[name() = $value])"> <xsl:variable name="image" select="umbraco.library:GetMedia($currentPage/*[name() = $value], 0)" /> <xsl:if test="$image/umbracoFile"> { image : '<xsl:value-of select="$image/umbracoFile"/>', alt : '<xsl:value-of select="$image/@nodeName"/>', text : '<xsl:value-of select="$image/@nodeName"/>' } <xsl:if test="position() != last()">,</xsl:if> </xsl:if> </xsl:if> </xsl:for-each>
                                ],
                                thumbnailActivationEvent : "click",

                                // Classes of HTML elements to use
                                mainImageClass : "picture-slides-image", // Mandatory
                                fadeContainerClass : "picture-slides-fade-container"
                        });
                </script>

                <div id="container">
                        <div id="picture-slides-frame">
                                <div class="picture-slides-container">
                                        <div class="picture-slides-fade-container">
                                                <img class="picture-slides-image" width="680px" height="310px" src="about:blank" alt="This is pictur" />
                                        </div>
                                </div>
                        </div>

                </div>
        </xsl:template>

</xsl:stylesheet>