Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Peter Alcock 106 posts 169 karma points
    Jun 08, 2012 @ 16:52
    Peter Alcock
    0

    Image Crop on Slideshow

    Hi guys

    Hoping someone can help it's driving me mad! I have a basic fading image slideshow built in XSLT with javascript, it works perfectly fine and resizes the images to 680x330 however i would prefer it to use a cropped image.

    Anyone have any ideas as to how to replace my standard getmedia umbracofile jobby to grab the cropped version of the image?

    many thanks

    Pete

    heres my code

    <?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:variable name="documentTypeAlias" select="string('FadingImage')"/>  
    <xsl:param name="currentPage"/>

    <xsl:template match="/">

      
    <div class="slider" id="slider">
        <div class="imageSlider" id="imageSlider" >
                    
        <xsl:for-each select="$currentPage/* [name() = $documentTypeAlias] ">
         <xsl:variable name="images" select="umbraco.library:GetMedia(picture, 0)" /> 
         <div class="imageSlide">    
           <div class="imageSliderImage">
            <img src="{$images/umbracoFile}" width="680px" height="330px" >
           </img>
             <div class="imageSliderInfo">
             <xsl:choose>
            <xsl:when test="string-length('textColour') &gt; 0">   
               <font>
                 <xsl:attribute name="color"><xsl:value-of select="textColour"/></xsl:attribute>
               <h3><xsl:value-of select="text"/></h3>
               </font>
               </xsl:when>
               <xsl:otherwise>
                  <font color="#000">
               <h3><xsl:value-of select="text"/></h3>
               </font>
               </xsl:otherwise>
               </xsl:choose>
             </div>
           </div>
          </div>

        </xsl:for-each>
       
    </div>
    </div>
         
    </xsl:template>
          
    </xsl:stylesheet>
    Copy Link
  • Fuji Kusaka 2203 posts 4220 karma points
    Jun 10, 2012 @ 07:34
    Fuji Kusaka
    0

    Hi Peter,

    You could try to change this part

     <img src="{$images/umbracoFile}" width="680px" height="330px" >

    to

      <img src="{concat(substring-before(umbraco.library:GetMedia(picture, 'true'),'.'),'_cropped.jpg')}" />

    "cropped" is the name given to DataType when creating your custom image cropper

     

    //fuji

    Copy Link
  • Nigel Wilson 939 posts 2061 karma points
    Jun 10, 2012 @ 21:58
    Nigel Wilson
    1

    Hi Peter

    Within your loop try adding the following - it should output the xml data of the media node and you can then see the crop data - if you have used the standard image cropping functionality you can access the crop file path directly - there is no need to do any concatenation.

    <div class="imageSlide">

    <textarea>
    <xsl:copy-of select="$images"/>
    </textarea>

    <div class="imageSliderImage">

    Cheers

    Nigel

    Copy Link

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies