1 | {combine_css path="themes/kardon/slideshow.css"} |
---|
2 | |
---|
3 | {footer_script require="jquery"}{literal} |
---|
4 | jQuery(document).ready(function() { |
---|
5 | var maxWidth = maxHeight = margin = 0; |
---|
6 | var finalW = w = {/literal}{$WIDTH_IMG}{literal}, finalH = h = {/literal}{$HEIGHT_IMG}{literal}; |
---|
7 | if (typeof( window.innerWidth ) == 'number') { |
---|
8 | // Non-IE |
---|
9 | maxWidth = window.innerWidth; |
---|
10 | maxHeight = window.innerHeight; |
---|
11 | } |
---|
12 | else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { |
---|
13 | //IE 6+ in 'standards compliant mode' |
---|
14 | maxWidth = document.documentElement.clientWidth; |
---|
15 | maxHeight = document.documentElement.clientHeight; |
---|
16 | } |
---|
17 | else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) { |
---|
18 | // IE 4 compatible |
---|
19 | maxWidth = document.body.clientWidth; |
---|
20 | maxHeight = document.body.clientHeight; |
---|
21 | } |
---|
22 | |
---|
23 | maxHeight = maxHeight-32; |
---|
24 | if ((h > maxHeight) || (w > maxWidth)) { |
---|
25 | if ((h > maxHeight) && (w > maxWidth)) { |
---|
26 | if (maxHeight-h < maxWidth-w) { |
---|
27 | finalH = maxHeight; |
---|
28 | finalW = w * finalH / h; |
---|
29 | } |
---|
30 | else { |
---|
31 | finalW = maxWidth; |
---|
32 | finalH = h * finalW / w; |
---|
33 | } |
---|
34 | } |
---|
35 | else if ((h > maxHeight) && (w < maxWidth)) { |
---|
36 | finalH = maxHeight; |
---|
37 | finalW = w * finalH / h; |
---|
38 | } |
---|
39 | else if ((h < maxHeight) && (w > maxWidth)) { |
---|
40 | finalW = maxWidth; |
---|
41 | finalH = h * finalW / w; |
---|
42 | } |
---|
43 | } |
---|
44 | if ((maxHeight-finalH) > 0) { |
---|
45 | margin = Math.round((maxHeight-finalH) / 2) |
---|
46 | } |
---|
47 | |
---|
48 | jQuery("#theImage").append('<img style="margin-top:'+margin+'px; width:'+finalW+'px;height:'+finalH+'px" src="{/literal}{$SRC_IMG}{literal}" alt="">'); |
---|
49 | }); |
---|
50 | {/literal}{/footer_script} |
---|
51 | |
---|
52 | <div id="imageHeaderBar"> |
---|
53 | <div class="browsePath"> |
---|
54 | {if isset($U_SLIDESHOW_STOP) } |
---|
55 | [ <a href="{$U_SLIDESHOW_STOP}">{'stop the slideshow'|@translate}</a> ] |
---|
56 | {/if} |
---|
57 | </div> |
---|
58 | <div class="imageNumber">{$PHOTO}</div> |
---|
59 | {if $SHOW_PICTURE_NAME_ON_TITLE } |
---|
60 | <h2 class="showtitle">{$current.TITLE}</h2> |
---|
61 | {/if} |
---|
62 | </div> |
---|
63 | |
---|
64 | <div id="imageToolBar"> |
---|
65 | {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'} |
---|
66 | </div> |
---|
67 | |
---|
68 | <div id="theImage"> |
---|
69 | <noscript> |
---|
70 | <div> |
---|
71 | <img src="{$SRC_IMG}" style="width:{$WIDTH_IMG}px;height:{$HEIGHT_IMG}px;" alt="{$ALT_IMG}"> |
---|
72 | </div> |
---|
73 | </noscript> |
---|
74 | </div> <!-- theImage --> |
---|