17/06/2012, 12:59:06
Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: #1.10.3
#~ Url du site : www.reflexions3.be/cmsms
#~ Hébergeur / Soft : ovh
#~ Informations Système :
#~ #~ Version du CMS: #1.10.3
#~ #~ Url du site : www.reflexions3.be/cmsms
#~ #~ Hébergeur / Soft : ovh
#~ #~ Informations Système :
#~ #~ #~ Cms Version: 1.10.3
#~ #~ #~ Installed Modules:
#~ #~ #~ CMSMailer: 2.0.2
#~ #~ #~ CMSPrinting: 1.0
#~ #~ #~ FileManager: 1.2.0
#~ #~ #~ MenuManager: 1.7.7
#~ #~ #~ MicroTiny: 1.1.1
#~ #~ #~ ModuleManager: 1.5.3
#~ #~ #~ News: 2.12.3
#~ #~ #~ Search: 1.7
#~ #~ #~ ThemeManager: 1.1.4
#~ #~ #~ TinyMCE: 2.9.6
#~ #~ #~ Gallery: 1.5.3
#~ #~ #~ FormBuilder: 0.7.2
#~ #~ #~ CGExtensions: 1.29
#~ #~ #~ FrontEndUsers: 1.17.5
#~ #~ #~ CustomContent: 1.8.2
#~ #~ #~ Config Information:
#~ #~ #~ php_memory_limit:
#~ #~ #~ process_whole_template: false
#~ #~ #~ output_compression: false
#~ #~ #~ max_upload_size: 64000000
#~ #~ #~ default_upload_permission: 664
#~ #~ #~ url_rewriting: none
#~ #~ #~ page_extension:
#~ #~ #~ query_var: page
#~ #~ #~ image_manipulation_prog: GD
#~ #~ #~ auto_alias_content: true
#~ #~ #~ locale:
#~ #~ #~ default_encoding: utf-8
#~ #~ #~ admin_encoding: utf-8
#~ #~ #~ set_names: true
#~ #~ #~ Php Information:
#~ #~ #~ phpversion: 5.2.17
#~ #~ #~ md5_function: On (Vrai)
#~ #~ #~ gd_version: 2
#~ #~ #~ tempnam_function: On (Vrai)
#~ #~ #~ magic_quotes_runtime: Off (Faux)
#~ #~ #~ E_STRICT: 0
#~ #~ #~ memory_limit: 128M
#~ #~ #~ max_execution_time: 120
#~ #~ #~ output_buffering: On
#~ #~ #~ safe_mode: Off (Faux)
#~ #~ #~ file_uploads: On (Vrai)
#~ #~ #~ post_max_size: 64M
#~ #~ #~ upload_max_filesize: 64M
#~ #~ #~ session_save_path: /tmp (1777)
#~ #~ #~ session_use_cookies: On (Vrai)
#~ #~ #~ xml_function: On (Vrai)
#~ #~ #~ Server Information:
#~ #~ #~ Server Api: cgi
#~ #~ #~ Server Db Type: MySQL (mysql)
#~ #~ #~ Server Db Version: 5.1.49
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~
Bonjour, c'est encore moi...
Mon client a revu sa copie pour ma galerie photo et il souhaite avoir le même gabarit pour la galerie parent et pour les galeries enfant.
Or, ce gabarit ne fonctionne pas pour les parents.
Voici la galerie enfant qui fonctionne:
http://www.reflexions3.be/cmsms/index.ph...60&page=60
La galerie parent n'affiche pas l'image en grand:
http://www.reflexions3.be/cmsms/index.ph...nts-prives
Je n'arrive pas à modifier mon gabarit suivant:
Code :
[== Indéfini ==]
<div class="gallery">
<div id="gallery" class="content">
<div class="slideshow-container">
<div id="loading" class="loader"></div>
<div id="slideshow" class="slideshow">
</div>
</div>
</div>
<div id="thumbs" class="navigation">
<ul class="thumbs noscript">
{foreach from=$images item=image}
<li>
{if $image->isdir}
<a href="{$image->file}" title="{$image->titlename}"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a>
{else}
<a class="thumb" href="{$image->file|escape:'url'|replace:'%2F':'/'}" title="{$image->titlename}" rel="history"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a>
{/if}
</li>
{/foreach}
</ul>
</div>
<div style="clear: both;"></div>
</div>La deuxième partie (else) fonctionne pour afficher les galeries enfant.
Comment faire à l'identique quand il s'agit de la galerie parent?
au cas ou, le code jquery:
Code :
[== JavaScript ==]
<script type="text/javascript" src="uploads/js/jquery.galleriffic.js"></script>
<script type="text/javascript" src="uploads/js/jquery.opacityrollover.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
// We only want these styles applied when javascript is enabled
$('div.navigation').css({'width' : '342px', 'float' : 'right'});
$('div.content').css('display', 'block');
// Initially set opacity on thumbs and add
// additional styling for hover effect on thumbs
var onMouseOutOpacity = 0.67;
$('#thumbs ul.thumbs li').opacityrollover({
mouseOutOpacity: onMouseOutOpacity,
mouseOverOpacity: 1.0,
fadeSpeed: 'fast',
exemptionSelector: '.selected'
});
// Initialize Advanced Galleriffic Gallery
var gallery = $('#thumbs').galleriffic({
delay: 2500,
numThumbs: 6,
preloadAhead: 10,
enableTopPager: false,
enableBottomPager: true,
maxPagesToShow: 7,
imageContainerSel: '#slideshow',
controlsContainerSel: '#controls',
captionContainerSel: '#caption',
loadingContainerSel: '#loading',
renderSSControls: true,
renderNavControls: true,
playLinkText: 'Play Slideshow',
pauseLinkText: 'Pause Slideshow',
prevLinkText: '‹ Previous Photo',
nextLinkText: 'Next Photo ›',
nextPageLinkText: 'Next ›',
prevPageLinkText: '‹ Prev',
enableHistory: false,
autoStart: true,
syncTransitions: true,
defaultTransitionDuration: 900,
onSlideChange: function(prevIndex, nextIndex) {
// 'this' refers to the gallery, which is an extension of $('#thumbs')
this.find('ul.thumbs').children()
.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
.eq(nextIndex).fadeTo('fast', 1.0);
},
onPageTransitionOut: function(callback) {
this.fadeTo('fast', 0.0, callback);
},
onPageTransitionIn: function() {
this.fadeTo('fast', 1.0);
}
});
});
</script>et les styles:
Code :
[== CSS ==]
div.content {
/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
display: none;
float: left;
width: 598px;
}
div.content a, div.navigation a {
text-decoration: none;
color: #777;
}
div.content a:focus, div.content a:hover, div.content a:active {
text-decoration: underline;
}
div.controls {
margin-top: 0px;
padding-top:60px;
height: 23px;
width:940px;
}
div.controls a {
padding: 10px;
}
div.ss-controls {
float: right;
}
div.nav-controls {
float: right;
}
div.slideshow-container {
position: relative;
clear: both;
height: 512px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.loader {
position: absolute;
top: 0;
left: 0;
background-image: url('loader.gif');
background-repeat: no-repeat;
background-position: center;
width: 598px;
height: 512px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.slideshow {
}
div.slideshow span.image-wrapper {
display: block;
position: absolute;
top: 0;
left: 0;
}
div.slideshow a.advance-link {
display: block;
width: 598px;
height: 512px; /* This should be set to be at least the height of the largest image in the slideshow */
line-height: 0px; /* This should be set to be at least the height of the largest image in the slideshow */
text-align: left;
margin: 0;
padding: 0;
}
div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
text-decoration: none;
}
div.slideshow img {
vertical-align: middle;
border: 0px solid #ccc;
}
div.download {
float: right;
}
div.caption-container {
position: relative;
clear: left;
height: 75px;
}
span.image-caption {
display: block;
position: absolute;
width: 940px;
top: 0;
left: 0;
}
div.caption {
padding: 0px;
}
div.image-title {
font-weight: bold;
font-size: 1.4em;
}
div.image-desc {
line-height: 1.3em;
padding-top: 0px;
}
div.navigation {
/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}
ul.thumbs {
clear: both;
margin: 0 0 0px 0px;
padding: 0;
float: right;
}
ul.thumbs li {
float: left;
padding: 0;
margin: 0 0 1px 1px;
list-style: none;
}
a.thumb {
padding: 0px;
display: block;
border: 0px solid #ccc;
}
ul.thumbs li.selected a.thumb {
background: #000;
}
a.thumb:focus {
outline: none;
}
ul.thumbs img {
border: none;
display: block;
}
div.pagination {
clear: both;
}
div.navigation div.top {
margin-bottom: 0px;
height: 0px;
}
div.navigation div.bottom {
margin-top: 0px;
margin-bottom:0px;
float: right;
}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
display: block;
float: left;
margin-right: 10px;
padding: 0px 0px 0px 0px;
border: 0px solid #ccc;
}
div.pagination a:hover {
background-color: #eee;
text-decoration: none;
}
div.pagination span.current {
font-weight: bold;
color: #fff;
}
div.pagination span.ellipsis {
border: none;
padding: 0px 0 0px 0px;
}Si quelqu'un est motivé pour plonger dans le code, je l'en remerci énormément d'avance !
Cordialement,
Pierre
