Changeset 27402 for extensions/Slide
- Timestamp:
- Feb 18, 2014, 8:08:00 AM (11 years ago)
- Location:
- extensions/Slide
- Files:
-
- 4 edited
Legend:
- Unmodified
- Added
- Removed
-
extensions/Slide/js/slideshow.js
r27126 r27402 79 79 $('ul',ele).append($('<li />').addClass('img-' + i).append($('<div />').addClass('contenerImg').width(options.width).height(cont_h).append(blockImg))); 80 80 81 var $block = $('.img-'+ i ,ele);82 _resizeSlideshowImag($block) ;83 84 81 }); 85 82 83 _resizeSlideshowImag(); 86 84 87 //resize and center image_____________________________________________________________________________________________________88 89 function _resizeSlideshowImag ($block){90 91 var $img = $block.find('img'),92 $descr = $block.find('.descr'),93 $img_w = $img.width(),94 $img_h = $img.height(),95 $img_r = $img_h/$img_w,96 $box_h = cont_h,97 $box_w = options.width,98 $box_r = $box_h/$box_w,99 $new_h,100 $new_w;101 102 if(($img_h > $box_h) || ($img_w > $box_w)){103 if($box_r < $img_r){104 $new_h = $box_h - 30;105 $new_w = $box_h / $img_r106 }else{107 $new_h = ($box_w * $img_r) - 30;108 $new_w = $box_w109 };110 111 }else{112 $new_h = $img_h;113 $new_w = $img_w;114 };115 var $left = ($(ele).data('e').s_w / 2)-($new_w / 2) + 'px',116 $top = ($box_h / 2)-($new_h / 2) + 'px';117 118 $img.css({119 width : $new_w + 'px',120 height : $new_h + 'px',121 left : $left,122 top : $top,123 });124 $descr.css(125 {126 left : $left,127 width : $new_w + 'px',128 height : $new_h/4,129 bottom : (($box_h / 2)-($new_h / 2)) + 'px',130 })131 // })132 };133 85 //slide_____________________________________________________________________________________________ 134 86 if(options.styleSlideshow == 'Slide'){ … … 323 275 324 276 //___________________________________________Fonctions_____________________________________________________________________________________ 277 //resize and center image__________________________________________________________________________________________________________________ 278 279 function _resizeSlideshowImag (){ 280 281 $('ul img',ele).each(function(){ 282 var $img = $(this), 283 $descr = $(this).prev(), 284 $img_w = $img.width(), 285 $img_h = $img.height(), 286 $img_r = $img_h/$img_w, 287 $box_h = cont_h, 288 $box_w = options.width, 289 $box_r = $box_h/$box_w, 290 $new_h, 291 $new_w; 292 if(($img_h > $box_h) || ($img_w > $box_w)){ 293 if($box_r < $img_r){ 294 $new_h = $box_h - 30; 295 $new_w = $box_h / $img_r 296 }else{ 297 $new_h = ($box_w * $img_r) - 30; 298 $new_w = $box_w 299 }; 300 301 }else{ 302 $new_h = $img_h; 303 $new_w = $img_w; 304 }; 305 var $left = ($(ele).data('e').s_w / 2)-($new_w / 2) + 'px', 306 $top = ($box_h / 2)-($new_h / 2) + 'px'; 307 308 $img.css({ 309 width : $new_w + 'px', 310 height : $new_h + 'px', 311 left : $left, 312 top : $top, 313 }); 314 $descr.css( 315 { 316 left : $left, 317 width : $new_w + 'px', 318 height : $new_h/4, 319 bottom : (($box_h / 2)-($new_h / 2)) + 'px', 320 }) 321 }) 322 }; 325 323 //animation________________________________________________________________________________________________________________________________ 326 324 function _rotate(ele) { -
extensions/Slide/template/picture.tpl
r26889 r27402 1 {* Example of resizeable2 {include file='include/autosize.inc.tpl'}3 *}4 1 5 2 {if isset($MENUBAR)}{$MENUBAR}{/if} … … 24 21 25 22 {strip}<a id="derivativeSwitchLink" title="{'Photo sizes'|@translate}" class="pwg-state-default pwg-button" rel="nofollow"> 26 <span class="pwg-icon pwg-icon-sizes"> </span><span class="pwg-button-text">{'Photo sizes'|@translate}</span>23 <span class="pwg-icon pwg-icon-sizes"></span><span class="pwg-button-text">{'Photo sizes'|@translate}</span> 27 24 </a> 28 25 <div id="derivativeSwitchBox" class="switchBox"> 29 26 <div class="switchBoxTitle">{'Photo sizes'|@translate}</div> 30 27 {foreach from=$current.unique_derivatives item=derivative key=derivative_type} 31 <span class="swit chCheck" id="derivativeChecked{$derivative_type}"{if $derivative->get_type() ne $current.selected_derivative->get_type()} style="visibility:hidden"{/if}>✔ </span>28 <span class="swit <span class="switchCheck" id="derivativeChecked{$derivative_type}"{if $derivative->get_type() ne $current.selected_derivative->get_type()} style="visibility:hidden"{/if}>✔ </span> 32 29 <span href="" class="derivative" data-typesave="{$derivative_type}" data-url="{$derivative->get_url()}" data-typemap="{$derivative->get_type()} " data-cookie="{$COOKIE_PATH}">{$derivative->get_type()|@translate}<span class="derivativeSizeDetails"> ({$derivative->get_size_hr()})</span> 30 33 31 </span><br> 34 32 {/foreach} 35 33 {if isset($U_ORIGINAL)} 36 34 {combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'} 37 35 <span class="original" href="" rel="nofollow" data-url="{$U_ORIGINAL}" data-winname="xxx" data-features="scrollbars=yes,toolbar=no,status=no,resizable=yes">{'Original'|@translate}</span> 38 36 {/if} 39 37 </div> 40 38 {/strip} … … 55 53 </a> 56 54 {/if}{/strip} 55 {if isset($PLUGIN_PICTURE_BUTTONS)}{foreach from=$PLUGIN_PICTURE_BUTTONS item=button}{$button}{/foreach}{/if} 57 56 {if isset($PLUGIN_PICTURE_ACTIONS)}{$PLUGIN_PICTURE_ACTIONS}{/if} 58 57 {strip}{if isset($favorite)} -
extensions/Slide/template/picture_nav_buttons.tpl
r26889 r27402 4 4 {if isset($slideshow.U_INC_PERIOD)} 5 5 <a href="{$slideshow.U_INC_PERIOD}" title="{'Reduce diaporama speed'|@translate}" class="pwg-state-default pwg-button"> 6 <span class="pwg-icon pwg-icon-clock-minus"> </span><span class="pwg-button-text">{'Reduce diaporama speed'|@translate}</span>6 <span class="pwg-icon pwg-icon-clock-minus"></span><span class="pwg-button-text">{'Reduce diaporama speed'|@translate}</span> 7 7 </a> 8 8 {else} 9 9 <span class="pwg-state-disabled pwg-button"> 10 <span class="pwg-icon pwg-icon-clock-minus"> </span><span class="pwg-button-text">{'Reduce diaporama speed'|@translate}</span>10 <span class="pwg-icon pwg-icon-clock-minus"></span><span class="pwg-button-text">{'Reduce diaporama speed'|@translate}</span> 11 11 </span> 12 12 {/if} 13 13 {if isset($slideshow.U_DEC_PERIOD)} 14 14 <a href="{$slideshow.U_DEC_PERIOD}" title="{'Accelerate diaporama speed'|@translate}" class="pwg-state-default pwg-button"> 15 <span class="pwg-icon pwg-icon-clock-plus"> </span><span class="pwg-button-text">{'Accelerate diaporama speed'|@translate}</span>15 <span class="pwg-icon pwg-icon-clock-plus"></span><span class="pwg-button-text">{'Accelerate diaporama speed'|@translate}</span> 16 16 </a> 17 17 {else} 18 18 <span class="pwg-state-disabled pwg-button"> 19 <span class="pwg-icon pwg-icon-clock-plus"> </span><span class="pwg-button-text">{'Accelerate diaporama speed'|@translate}</span>19 <span class="pwg-icon pwg-icon-clock-plus"></span><span class="pwg-button-text">{'Accelerate diaporama speed'|@translate}</span> 20 20 </span> 21 21 {/if} … … 23 23 {if isset($slideshow.U_START_REPEAT)} 24 24 <a href="{$slideshow.U_START_REPEAT}" title="{'Repeat the slideshow'|@translate}" class="pwg-state-default pwg-button"> 25 <span class="pwg-icon pwg-icon-repeat-play"> </span><span class="pwg-button-text">{'Repeat the slideshow'|@translate}</span>25 <span class="pwg-icon pwg-icon-repeat-play"></span><span class="pwg-button-text">{'Repeat the slideshow'|@translate}</span> 26 26 </a> 27 27 {/if} 28 28 {if isset($slideshow.U_STOP_REPEAT)} 29 29 <a href="{$slideshow.U_STOP_REPEAT}" title="{'Not repeat the slideshow'|@translate}" class="pwg-state-default pwg-button"> 30 <span class="pwg-icon pwg-icon-repeat-stop"> </span><span class="pwg-button-text">{'Not repeat the slideshow'|@translate}</span>30 <span class="pwg-icon pwg-icon-repeat-stop"></span><span class="pwg-button-text">{'Not repeat the slideshow'|@translate}</span> 31 31 </a> 32 32 {/if} 33 33 {strip}{if isset($first)} 34 34 <a href="{$first.U_IMG}" title="{'First'|@translate} : {$first.TITLE}" class="pwg-state-default pwg-button slshFirst"> 35 <span class="pwg-icon pwg-icon-arrowstop-w"> </span><span class="pwg-button-text">{'First'|@translate}</span>35 <span class="pwg-icon pwg-icon-arrowstop-w"></span><span class="pwg-button-text">{'First'|@translate}</span> 36 36 </a> 37 37 {else} 38 38 <span class="pwg-state-disabled pwg-button"> 39 <span class="pwg-icon pwg-icon-arrowstop-w"> </span><span class="pwg-button-text">{'First'|@translate}</span>39 <span class="pwg-icon pwg-icon-arrowstop-w"></span><span class="pwg-button-text">{'First'|@translate}</span> 40 40 </span> 41 41 {/if}{/strip} 42 42 {strip}{if isset($U_UP) and !isset($slideshow)} 43 43 <a href="{$U_UP}" title="{'Thumbnails'|@translate}" class="pwg-state-default pwg-button"> 44 <span class="pwg-icon pwg-icon-arrow-n"> </span><span class="pwg-button-text">{'Thumbnails'|@translate}</span>44 <span class="pwg-icon pwg-icon-arrow-n"></span><span class="pwg-button-text">{'Thumbnails'|@translate}</span> 45 45 </a> 46 46 {/if}{/strip} 47 47 {strip}{if isset($previous)} 48 <a href="{$previous.U_IMG}" title="{'Previous'|@translate} : {$previous.TITLE |@escape}" class="pwg-state-default pwg-button">49 <span class="pwg-icon pwg-icon-arrow-w"> </span><span class="pwg-button-text">{'Previous'|@translate}</span>48 <a href="{$previous.U_IMG}" title="{'Previous'|@translate} : {$previous.TITLE_ESC}" class="pwg-state-default pwg-button"> 49 <span class="pwg-icon pwg-icon-arrow-w"></span><span class="pwg-button-text">{'Previous'|@translate}</span> 50 50 </a> 51 51 {else} 52 52 <span class="pwg-state-disabled pwg-button"> 53 <span class="pwg-icon pwg-icon-arrow-w"> </span><span class="pwg-button-text">{'Previous'|@translate}</span>53 <span class="pwg-icon pwg-icon-arrow-w"></span><span class="pwg-button-text">{'Previous'|@translate}</span> 54 54 </span> 55 55 {/if}{/strip} 56 56 {if isset($slideshow.U_START_PLAY)} 57 57 <a href="{$slideshow.U_START_PLAY}" title="{'Play of slideshow'|@translate}" class="pwg-state-default pwg-button"> 58 <span class="pwg-icon pwg-icon-play"> </span><span class="pwg-button-text">{'Play of slideshow'|@translate}</span>58 <span class="pwg-icon pwg-icon-play"></span><span class="pwg-button-text">{'Play of slideshow'|@translate}</span> 59 59 </a> 60 60 {/if} 61 61 {if isset($slideshow.U_STOP_PLAY)} 62 62 <a href="{$slideshow.U_STOP_PLAY}" title="{'Pause of slideshow'|@translate}" class="pwg-state-default pwg-button"> 63 <span class="pwg-icon pwg-icon-pause"> </span><span class="pwg-button-text">{'Pause of slideshow'|@translate}</span>63 <span class="pwg-icon pwg-icon-pause"></span><span class="pwg-button-text">{'Pause of slideshow'|@translate}</span> 64 64 </a> 65 65 {/if} 66 66 {strip}{if isset($next)} 67 67 <a href="{$next.U_IMG}" title="{'Next'|@translate} : {$next.TITLE|@escape}" class="pwg-state-default pwg-button pwg-button-icon-right"> 68 <span class="pwg-icon pwg-icon-arrow-e"> </span><span class="pwg-button-text">{'Next'|@translate}</span>68 <span class="pwg-icon pwg-icon-arrow-e"></span><span class="pwg-button-text">{'Next'|@translate}</span> 69 69 </a> 70 70 {else} 71 71 <span class="pwg-state-disabled pwg-button pwg-button-icon-right"> 72 <span class="pwg-icon pwg-icon-arrow-e"> </span><span class="pwg-button-text">{'Next'|@translate}</span>72 <span class="pwg-icon pwg-icon-arrow-e"></span><span class="pwg-button-text">{'Next'|@translate}</span> 73 73 </span> 74 74 {/if}{/strip} … … 79 79 {else} 80 80 <span class="pwg-state-disabled pwg-button pwg-button-icon-right"> 81 <span class="pwg-icon pwg-icon-arrowstop-e"> </span><span class="pwg-button-text">{'Last'|@translate}</span>81 <span class="pwg-icon pwg-icon-arrowstop-e"></span><span class="pwg-button-text">{'Last'|@translate}</span> 82 82 </span> 83 83 {/if}{/strip}-->*} -
extensions/Slide/theme.css
r27022 r27402 182 182 } 183 183 184 .dd_wrapper, .cl_wrapper, .cc_wrapper, #menubar dt , #menubar dt a{184 .dd_wrapper, .cl_wrapper, .cc_wrapper, #menubar dt { 185 185 float: left; 186 186 padding: 3px 16px 6px; … … 190 190 text-decoration: none; 191 191 font-size: 16px; 192 } 193 #menubar dt a{ 194 color: #B3B3B3; 192 195 } 193 196 .activate{
Note: See TracChangeset
for help on using the changeset viewer.