cmsplugin-gallery / cmsplugin_gallery / templates / cmsplugin_gallery / easyslider.html

{% extends "cmsplugin_gallery/base.html" %}
{% load thumbnail %}
{% block cmsplugin_gallery_js %}
{{ block.super }}
<script type="text/javascript" src="{{ cmsplugin_gallery_media_url }}/easyslider/easySlider.packed.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function($) {
        $('#cmsplugin_gallery_easyslider_{{ gallery.id }}').easySlider();
    });
</script>
{% endblock %}
{% block cmsplugin_gallery_css %}
{{ block.super }}
<style type="text/css">
    #cmsplugin_gallery_easyslider_{{ gallery.id }} ul,
    #cmsplugin_gallery_easyslider_{{ gallery.id }} li {
        margin: 0;
        padding: 0;
        list-style: none;
	}

    #cmsplugin_gallery_easyslider_{{ gallery.id }},
    #cmsplugin_gallery_easyslider_{{ gallery.id }} li {
        /* 
        define width and height of container element and list item (slide)
        list items must be the same size as the slider area
        */  
        width:500px;
        height:330px;
        overflow:hidden; 
    }
</style>
{% endblock %}
{% block cmsplugin_gallery_content %}
<div id="cmsplugin_gallery_easyslider_{{ gallery.id }}" class="cmsplugin_gallery_easyslider">
    <ul>
        {% for photo in gallery.active_photos %}
        <li>{% if photo.link %}<a href="{{ photo.link }}" title="{{ photo.title }}">{% endif %}<img src="{{ photo.image.url }}" alt="{{ photo.title }}" longdesc="{{ photo.description }}" />{% if photo.link %}</a>{% endif %}</li>{% endfor %}
    </ul>
</div>
{% endblock %}
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.