{% load feincms_thumbnail %}

<!-- You have to define the image size in the image attribute for the js to work. -->
<!-- You could also add caption and description to the images like so: -->
<!--li><a title="You can add captions to images in the lightbox which are different from the carousel" href="images/img2_800.jpg">
 	<img alt="{{ image.translation.description }}" src="{{ image.file.name|cropscale:'200x150' }}" width="200" height="150" />
	<p>My caption is different from my bigger version's caption</p></a>
</li-->


<div id="carousel{{ content.id }}" class="carousel context">
    <ul>
    	{% for image in images %}
        <li><a title="{{ image.translation.description }}" href="{{ image.file.name|thumbnail:'800x600' }}">
        	<img alt="{{ image.translation.description }}" src="{{ image.file.name|cropscale:'160x120' }}" width="160" height="120" />
			<p>{{ image.translation.caption }}</p></a>
		</li>
        {% endfor %}
    </ul>
</div>
