Tweet
Hallo,
ich bin noch an meinen Bildern dran. Kann ich den Bildpfad im Galerie-Template dynamisch vorgelegen? Ich benutze das Template "gallery_elevatezoom.html5".
Ich will den Pfad angeben und den Dateinamen dann mit
einfügen.
Danke
Hier das Template:
ich bin noch an meinen Bildern dran. Kann ich den Bildpfad im Galerie-Template dynamisch vorgelegen? Ich benutze das Template "gallery_elevatezoom.html5".
Ich will den Pfad angeben und den Dateinamen dann mit
PHP-Code:
<?php echo $this->field('alias')->value(); ?>-01.jpg
Danke
Hier das Template:
PHP-Code:
<?php // include jquery and scripts
global $objPage;
if(!$objPage->hasJQuery)
{
$GLOBALS['TL_JAVASCRIPT'][] = '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js';
}
$GLOBALS['TL_JAVASCRIPT'][] = 'files/cto_layout/scripts/elevatezoom/jquery.elevatezoom.js';
?>
<div class="ce_elevatezoom elevatezoom_gallery_wrapper">
<div class="elevatezoom_gallery_window">
<?php foreach ($this->body as $class=>$row): ?>
<?php foreach ($row as $i => $col): ?>
<?php if ($col->addImage && $col->src): ?>
<?php if($i == 0): ?>
<?php if($col->href) :?>
<a id="elevatezoom_image_gallery_<?php echo $this->id; ?>_window" class="elevatezoom_gallery" href="<?= $col->href ?>"<?= $col->attributes ?> title="<?= $col->alt ?>">
<?php endif; ?>
<img id="elevatezoom_image_gallery_<?php echo $this->id; ?>" data-zoom-image="<?php echo $col->singleSRC; ?>" src="<?php echo $col->singleSRC; ?>"<?php echo $col->imgSize; ?> alt="<?php echo $col->alt; ?>" title="<?php echo $col->caption; ?>">
<?php if($col->href) :?>
</a>
<?php endif; ?>
<?php endif; ?>
<?php endif; ?>
<?php endforeach; ?>
<?php endforeach; ?>
</div>
<div id="elevatezoom_gallery_<?php echo $this->id; ?>" class="elevatezoom_gallery gallery">
<ul class="cols_<?php echo $this->perRow; ?>" id="gallery_<?php echo $this->id; ?>">
<?php foreach ($this->body as $class=>$row): ?>
<?php foreach ($row as $i => $col): ?>
<?php if ($col->addImage && $col->src): ?>
<li class="entry row<?php echo $this->perRow; ?> <?php echo $col->class; ?>">
<a class="elevatezoom_gallery button" href="<?= $col->href ?: '#' ?>"<?= $col->attributes ?> title="<?= $col->alt ?>" data-image="<?php echo $col->singleSRC; ?>" data-zoom-image="<?php echo $col->singleSRC; ?>">
<img src="<?php echo $col->singleSRC; ?>"<?php echo $col->imgSize; ?> alt="<?php echo $col->alt; ?>" title="<?php echo $col->caption; ?>">
</a>
</li>
<?php endif; ?>
<?php endforeach; ?>
<?php endforeach; ?>
</ul>
</div>
<script type="text/javascript">
/* <![CDATA[ */
/**
* Activate the zoom
* See: http://www.elevateweb.co.uk/image-zoom/examples
*/
jQuery(document).ready(function()
{
jQuery('#elevatezoom_image_gallery_<?php echo $this->id; ?>').elevateZoom(
{
gallery:'elevatezoom_gallery_<?php echo $this->id; ?>',
galleryActiveClass: 'active',
responsive: true,
cursor: 'pointer',
imageCrossfade: true,
zoomType : "inner",
lensShape : "round",
lensSize : 400
});
jQuery('#elevatezoom_gallery_<?php echo $this->id; ?> a').bind('click',function()
{
jQuery('#elevatezoom_image_gallery_<?php echo $this->id; ?>_window').attr('href', jQuery(this).data('zoom-image') );
});
});
/* ]]> */
</script>
</div>
Kommentar