Ignore:
Timestamp:
Dec 17, 2013, 11:22:53 PM (10 years ago)
Author:
Miklfe
Message:
 
File:
1 edited

Legend:

Unmodified
Added
Removed

  • extensions/Slim/template/mainpage_categories.tpl

    r18905 r25997  
    11{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 
     2<div id="carousel">
    123<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                                                
     4        <div class="jcarousel">
     5                <ul>
     6                        {foreach from=$category_thumbnails item=cat}
     7                                <li>
     8                                                <div class="illustration">
     9                                                        <a href="{$cat.URL}">
     10                                                                <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}"/>
     11                                                        </a>
     12                                                </div>
     13                                                <div class="CatMPdescription">
    2714                                                        <h3>
    2815                                                                <a href="{$cat.URL}">{$cat.NAME}</a>
    2916                                                        </h3>
    3017                                                        <div>
    31                                                         {$cat.CAPTION_NB_IMAGES}
     18                                                                {$cat.CAPTION_NB_IMAGES}
    3219                                                        </div> 
    33                                         </div>
    34                         </li>
    35                 {/foreach}
    36         </ul>
    37 {footer_script}{literal}
    38 function 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 
    48 jQuery(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}
     20                                                </div>
     21                                </li>
     22                        {/foreach}
     23                </ul>
     24        </div>
    5925</div>
     26        <a href="#" class="jcarousel-control-prev">&lsaquo;</a>
     27    <a href="#" class="jcarousel-control-next">&rsaquo;</a>
    6028</div>
Note: See TracChangeset for help on using the changeset viewer.