30 lines
910 B
HTML
30 lines
910 B
HTML
{% load thumbnail %}
|
|
<div class="gallery" id="gallery-{{cell.id}}">
|
|
{% for image in cell.image_set.all %}
|
|
{% if forloop.first %}
|
|
{% thumbnail image.image "640x480" crop="50% 25%" as im %}
|
|
<div class="first">
|
|
<img src="{{ im.url }}"/>
|
|
<span>{% if image.title %}{{ image.title }}{% endif %}</span>
|
|
</div>
|
|
<div>
|
|
{% endthumbnail %}
|
|
{% endif %}
|
|
{% thumbnail image.image "60x60" crop="50% 25%" as im %}
|
|
{% thumbnail image.image "640x480" crop="50% 25%" as im_large %}
|
|
<span data-image-large="{{ im_large.url }}"><img src="{{ im.url }}"
|
|
{% if image.title %} title="{{image.title}}" {% endif %}/></span>
|
|
{% endthumbnail %}
|
|
{% endthumbnail %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
$(function() {
|
|
var $gallery = $('#gallery-{{cell.id}}');
|
|
$gallery.find('span').on('click', function() {
|
|
$gallery.find('div.first img').attr('src', $(this).data('image-large'));
|
|
});
|
|
});
|
|
</script>
|