http://our.umbraco.org/forum/using/ui-questions/23771-Advice-about-carousels

Similar to this...

the xslt script that I have doesn't use jquery.malsup but a custom implementation on top of the jqueryUI framework...

looking at your html above... think this should be close to what you want... untested so may need some debugging....

<?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" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets" xmlns:JPT.Files="urn:JPT.Files" xmlns:JPT.Util="urn:JPT.Util" xmlns:PS.XSLTsearch="urn:PS.XSLTsearch" 
  exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets JPT.Files JPT.Util PS.XSLTsearch ">


<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>
<xsl:variable name="MediaNodeId" select="/macro/MediaNode/Folder/@id"/>

<xsl:template match="/">
  <xsl:value-of select="umbraco.library:RegisterJavaScriptFile('Malsup', 'pathtoJSFile')"/>

  <div class="pics">        
    <div class="pics"> 
      <xsl:for-each select="umbraco.library:GetMedia($MediaNodeId, 1)/MEDIATYPE">
        <img src="{./umbracoFile}" title="{./title}" alt="{./alt}" url="{./url}" width="{./width}" />
      </xsl:for-each>
   </div> 
  </div>

</xsl:template>

</xsl:stylesheet>

Hi Mike thanks for the guidance, as I said my XSLT knowledge is not great, am receiving this error message

System.OverflowException: Value was either too large or too small for an Int32.
at System.Convert.ToInt32(Double value)
at System.Convert.ChangeType(Object value, Type conversionType, IFormatProvider provider)
at System.Xml.Xsl.Runtime.XmlQueryRuntime.ChangeTypeXsltArgument(XmlQueryType xmlType, Object value, Type destinationType)
at System.Xml.Xsl.Runtime.XmlQueryContext.InvokeXsltLateBoundFunction(String name, String namespaceUri, IList`1[] args)
at (XmlQueryRuntime {urn:schemas-microsoft-com:xslt-debug}runtime)
at Root(XmlQueryRuntime {urn:schemas-microsoft-com:xslt-debug}runtime)
at System.Xml.Xsl.XmlILCommand.Execute(Object defaultDocument, XmlResolver dataSources, XsltArgumentList argumentList, XmlWriter writer)
at System.Xml.Xsl.XslCompiledTransform.Transform(IXPathNavigable input, XsltArgumentList arguments, TextWriter results)
at umbraco.presentation.webservices.codeEditorSave.SaveXslt(String fileName, String oldName, String fileContents, Boolean ignoreDebugging)

I have edited your XSLT for my needs

<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>
<xsl:variable name="MediaNodeId" select="/macro/MediaNode/Folder/@id"/>

<xsl:template match="/">
  <xsl:value-of select="umbraco.library:RegisterJavaScriptFile('Malsup', 'js/jquery.cycle/jquery.cycle.all.min.js')"/>
        
    <div class="pics">
      <xsl:for-each select="umbraco.library:GetMedia($MediaNodeId, 1)/Headerimages">
        <img src="{./umbracoFile}" title="{./title}" alt="{./description}" url="{./url}" width="{./width}" />
      xsl:for-each>
   div>
 
xsl:template>

xsl:stylesheet>

 I have named my MediaType - Headerimages, do I need to change the variable name to Headerimages? Also my macro is now called headerimages. Would anything need to change to reflect this in my XSLT.

Thanks, Matt

ah, you may need a check for the mediaNode not being empty...

add an if around the for-each

<xsl:if test="$MediaNodeId != '' and $MediaNodeId != false() ">
....
</xsl:if>

Hi Mike, still not getting any joy (although error messages are now no longer displayed) web page just does not display no images  This is my current HTML surrounding the area:-

            
      <div class="pics">
      
      <umbraco:Macro Alias="Headerimage" runat="server"></umbraco:Macro>
        
    
      </div>

This is my XSLT:-

<?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" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets" 
  exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">


<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>
<xsl:variable name="MediaNodeId" select="/macro/MediaNode/Folder/@id"/>

<xsl:template match="/">
  <xsl:value-of select="umbraco.library:RegisterJavaScriptFile('cycle', '/js/jquery.cycle/jquery.cycle.all.min.js')"/>
        
          
      <xsl:if test="$MediaNodeId != '' and $MediaNodeId != false() ">    
      
      <xsl:for-each select="umbraco.library:GetMedia($MediaNodeId, 1)/Headerimages">
        <img src="{./umbracoFile}" title="{./title}" alt="{./description}" url="{./url}" width="{./width}" />
      </xsl:for-each>
      
      </xsl:if>
       
 
  </xsl:template>

</xsl:stylesheet>

Headerimages is the new mediatype I have created.  Looking at my XSLT would I need to change the variable name which is currently MediaNodeId or is this irrelevent?

Your help is much appreciated.

Ok, you are missing the vital link....

You need to add a paramater to your macro! called MediaNode, and set it's type as mediaCurrent... then when you insert the macro into the tempalte you will get a dialogue asking you to pick the folder from the media area where your images are contained.

Mike,

That was it...! All working great.  Many thanks for your help, clocking off in 20mins with a big smile on my face

Glad to help.

Hi Mike,

Just encountered a small issue, i'd like to be able to return a NiceUrl rather than the NodeId I am currently receiving.  Do you have idea how I would implement this in the above code.  I'm guessing NiceUrl declaration needs to be wrapped around the URL in my XSLT but have been unable to work it out. 

<xsl:templatematch="/">
  <xsl:value-ofselect="umbraco.library:RegisterJavaScriptFile('cycle', '/js/jquery.cycle/jquery.cycle.all.min.js')"/>
        
          
      <xsl:iftest="$MediaNodeId != '' and $MediaNodeId != false() ">    
      
      <xsl:for-eachselect="umbraco.library:GetMedia($MediaNodeId, 1)/Headerimages">
        <imgsrc="{./umbracoFile}"title="{./title}"alt="{./description}"url="{./url}"width="{./width}"/>
      </xsl:for-each>
      
      </xsl:if>
       
 
  </xsl:template>

I assume you mean ./url is giving you a node id?

if so then use the umbraco.library method NiceUrl

url="{umbraco.library:NiceUrl(./url)}"

That's perfect, many thanks, tried wrapping umbraco.library method NiceUrl a few ways but couldnt get it to work. Great stuff!

Hi Mike,

Just noticed a small issue with my image slideshow. URL links work great it seems at top level pages (http://www.ystrad-mynach.ac.uk/home) but at any child level pages (http://www.ystrad-mynach.ac.uk/the-college/about/) URL links are linking to current page.

I'm assuming i'm missing perhaps a '../' somewhere possible as it might be an absolute/relative link issue.  Hoping you can solve my problem.

Many Thanks

Matt

is working on a reply...