Hallo acidburn
Ich bin so nett. 
Hier das Template in html5-Version. Vorher aber die Erweiterung imagflow installieren. Die Imageflow-Settings wie opacity, usw. musst du im Template vornehmen. background-color in deinem Stylesheets. Gruss Marko
Code:
<!-- indexer::stop -->
<?php
/*
* Important!!!!
* This template requires the contao-extension "imageflow"
*
*/
$GLOBALS['TL_JAVASCRIPT'][] = 'system/modules/gallery_creator/html/gallery_creator_fe.js';
?>
<?php if (!$this->Input->get('vars')): ?>
<!--start album-overview-->
<div class="<?php echo $this->class; ?> gallery_creator block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<?php if ($this->headline): ?>
<<?php echo $this->hl; ?>><?php echo $this->headline; ?></<?php echo $this->hl; ?>>
<?php endif; ?>
<?php echo $this->pagination; ?>
<?php if (count($this->arrAlbums)>0): ?>
<ul class="list_albums">
<?php foreach ($this->arrAlbums as $Album): ?>
<li class="level_1 block row" style="<?php echo $this->imagemargin; ?>">
<div class="tstamp block">[<?php echo $Album["event_date"]; ?>]</div>
<div class="col_1">
<figure class="image_container" onmouseover="<?php echo $Album["thumbMouseover"]; ?>">
<?php if ($Album["href"]): ?>
<a href="<?php echo $Album["href"]; ?>" title="<?php echo $Album["title"]; ?>">
<?php endif; ?>
<img src="<?php echo $Album["thumb_src"]; ?>" alt="<?php echo $Album["alt"]; ?>" class="<?php echo $Album["class"]; ?>">
<?php if ($Album["href"]): ?>
</a>
<?php endif; ?>
</figure>
</div>
<div class="col_2">
<h2><?php echo $Album["name"]; ?></h2>
<?php if ($Album["count"]): ?>
<p class="count_pics"><?php echo $Album["count"]; ?> <?php echo $GLOBALS["TL_LANG"]["gallery_creator"]["pictures"]; ?></p>
<?php endif; ?>
<?php if ($Album["count_subalbums"]): ?>
<p class="count_pics"><?php echo $Album["count_subalbums"]; ?> <?php echo $GLOBALS['TL_LANG']['gallery_creator']['subalbums']; ?></p>
<?php endif; ?>
<?php if ($Album["comment"]): ?>
<p class="album_comment"><?php echo $Album["comment"]; ?></p>
<?php endif; ?>
</div>
<div class="clr"><!--clearing-box--></div>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready', function() {
//Weiterleitung bei Klick auf das, das Bild enthaltende Listenelement
$$("ul.list_albums li.level_1").addEvent('click', function() {
var href = this.getElement('a').get('href');
var myURI = new URI();
var redirect = myURI.get('scheme') + '://' + myURI.get('host') + myURI.get('directory') + href;
window.parent.location=redirect;
});
/**
* Cursor über h2
*/
$$('.gallery_creator li.level_1').setStyle('cursor', 'pointer');
//bei domready erhält das erste Listenelement einen overlay
$$(".gallery_creator ul.list_albums").getFirst("li").addClass('active');
//Klassenzuweisung
$$(".gallery_creator ul.list_albums li.level_1").addEvent('mouseover', function() {
$$(".gallery_creator ul.list_albums").getFirst("li").removeClass('active');
this.addClass('active');
});
//Klassenentfernung
$$(".gallery_creator ul.list_albums li.level_1").addEvent('mouseout', function() {
this.removeClass('active');
});
});
//--><!]]>
</script>
<!--end album-overview-->
<?php endif; ?>
<?php if ($this->Input->get('vars')): ?>
<?php
//Load image Flow js & css
$GLOBALS['TL_CSS'][] = 'plugins/imageflow/imageflow.css';
$GLOBALS['TL_JAVASCRIPT'][] = 'plugins/imageflow/imageflow.js';
?>
<!--start detailview-->
<div class="<?php echo $this->class; ?> gallery_creator block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<?php if ($this->headline): ?>
<<?php echo $this->hl; ?>><?php echo $this->headline; ?></<?php echo $this->hl; ?>>
<?php endif; ?>
<?php if ($this->backLink): ?>
<div class="backLink"><a href="<?php echo $this->backLink; ?>" title="zurück">« <?php echo $GLOBALS['TL_LANG']['gallery_creator']['back_to_general_view']; ?></a></div>
<?php endif; ?>
<?php if ($this->Albumname): ?>
<h2><?php echo $this->Albumname; ?></h2>
<?php endif; ?>
<?php if ($this->error): ?>
<?php foreach ($this->error as $errorMessage): ?>
<p><?php echo $errorMessage; ?></p>
<?php endforeach; ?>
<?php return; ?>
<?php endif; ?>
<?php echo $this->pagination; ?>
<?php if ($this->subalbums): ?>
<!-- Unteralben anzeigen -->
<div class="subalbums">
<h3>Unteralben von: <?php echo $this->Albumname; ?></h3>
<ul class="list_albums">
<?php foreach ($this->subalbums as $Subalbum): ?>
<li class="level_1 block row" style="<?php echo $this->imagemargin; ?>">
<div class="tstamp block">[<?php echo $Subalbum["event_date"]; ?>]</div>
<div class="col_1">
<figure class="image_container" onmouseover="<?php echo $Album["thumbMouseover"]; ?>">
<?php if ($Subalbum["href"]): ?>
<a href="<?php echo $Subalbum["href"]; ?>" title="<?php echo $Subalbum["title"]; ?>">
<?php endif; ?>
<img src="<?php echo $Subalbum["thumb_src"]; ?>" alt="<?php echo $Subalbum["alt"]; ?>" class="<?php echo $Subalbum["class"]; ?>">
<?php if ($Subalbum["href"]): ?>
</a>
<?php endif; ?>
</figure>
</div>
<div class="col_2">
<h2><?php echo $Subalbum["name"]; ?></h2>
<?php if ($Subalbum["count"]): ?>
<p class="count_pics"><?php echo $Album["count"]; ?> <?php echo $GLOBALS["TL_LANG"]["gallery_creator"]["pictures"]; ?></p>
<?php endif; ?>
<?php if ($Subalbum["count_subalbums"]): ?>
<p class="count_pics"><?php echo $Subalbum["count_subalbums"]; ?> <?php echo $GLOBALS["TL_LANG"]["gallery_creator"]["subalbums"]; ?></p>
<?php endif; ?>
<?php if ($Subalbum["comment"]): ?>
<p class="album_comment"><?php echo $Subalbum["comment"]; ?></p>
<?php endif; ?>
</div>
<div class="clr"><!--clearing-box--></div>
</li>
<?php endforeach;?>
</ul>
</div>
<!-- Ende Unteralben anzeigen -->
<?php endif; ?>
<!--detailview imageFlow-->
<?php if ($this->arrPictures): ?>
<?php $imageNumber=0; ?>
<div id="myImageFlow" class="imageflow">
<?php foreach ($this->arrPictures as $Picture): ?>
<?php $imageNumber++; ?>
<img rel="myImageFlow" src="<?php echo $Picture["href"]; ?>" longdesc="<?php echo $Picture["href"]; ?>" width="<?php echo $Picture["image_width"]; ?>" height="<?php echo $Picture["image_height"]; ?>" alt="<?php echo $Picture["comment"]; ?>">
<?php endforeach;?>
</div>
<?php endif; ?>
</div>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready', function()
{
new ImageFlow().init({
ImageFlowID: 'myImageFlow',
imagePath: '../../',
// do some changes below this to change the behavior of imageflow
// learn more about at: http://finnrudolph.de/ImageFlow/Documentation
imagesHeight: 0.5,
reflectPath: 'plugins/imageflow/',
reflectionPNG: false,
aspectRatio: 1.7,
reflections: false,
//reflectionGET: '&height=20%',
//reflectionP: 0.2,
imageFocusM:1,
imageFocusMax: 2,
slideshowAutoplay: false,
startID: 1,
animationSpeed: 100,
preloadImages: true,
startAnimation: true,
slider: true,
slideshow:true,
slideshowSpeed:4000,
slideshowAutoplay:true,
buttons: true,
captions: true,
opacity: false,
circular: true,
glideToStartID: true,
xStep:150,
onClick: function(event)
{
var position = 0;
var images = [];
document.getElements(('img[rel='+this.getAttribute('rel')+']')).each( function(el, index) {
images.include([el.getAttribute('longdesc'), el.getAttribute('alt')]);
if (this == el)
position = index;
}.bind(this));
window.Mediabox ? Mediabox.open(images, position) : Slimbox.open(images, position);
}
});
});
//--><!]]>
</script>
<!--end detailview-->
<?php endif; ?>
<!-- indexer::continue -->
[gallery_creator] Anderes bzw. eigenes Template?
Zitieren
du bringst Sonne ins dunkle Tal. Ich habe tatsächlich eine alte Version die ganze Zeit gesucht. 
Lesezeichen