source: extensions/Slim/template/mainpage_categories.tpl @ 18905

Last change on this file since 18905 was 18905, checked in by Miklfe, 8 years ago

modification du carousel

File size: 1.5 KB
Line 
1{define_derivative name='carousel' width='300' height='300' min_width='300'}
2
3
4{html_style}
5.jcarousel-skin-cat .jcarousel-list li{ldelim}
6        min-width:{$carousel->max_width()}px;
7{/html_style}
8
9
10<div id="carouselcat">
11
12<div id="wrap">
13          <ul id="carousel" class="jcarousel-skin-cat">
14
15                {foreach from=$category_thumbnails item=cat}
16
17
18                        <li class="test">
19                                        <div class="illustration">
20                                                <a href="{$cat.URL}">
21                                                        <img src="{$pwg->derivative_url($carousel, $cat.representative.src_image)}" alt="{$cat.TN_ALT}" title="{$cat.NAME|@replace:'"':' '|@strip_tags:false} - {'display this album'|@translate}" min-width="{$carousel->max_width()}" height="{$carousel->max_height()-22}"/>
22                                                </a>
23                                        </div>
24                                       
25                                        <div class="CatMPdescription">
26                                               
27                                                        <h3>
28                                                                <a href="{$cat.URL}">{$cat.NAME}</a>
29                                                        </h3>
30                                                        <div>
31                                                        {$cat.CAPTION_NB_IMAGES}
32                                                        </div> 
33                                        </div>
34                        </li>
35                {/foreach}
36        </ul>
37{footer_script}{literal}
38function mycarousel_initCallback(carousel)
39{
40    // Pause autoscrolling if the user moves with the cursor over the clip.
41    carousel.clip.hover(function() {
42        carousel.stopAuto();
43    }, function() {
44        carousel.startAuto();
45    });
46};
47
48jQuery(document).ready(function() {
49    jQuery('#carousel').jcarousel({
50        auto: 1,
51                wrap: 'circular',
52                scroll: 2,
53                animation: 2000,
54                initCallback: mycarousel_initCallback,
55               
56    });
57});
58{/literal}{/footer_script}
59</div>
60</div>
Note: See TracBrowser for help on using the repository browser.