Hallo,
ich verwende dieses JavaScript-Script für einen Parallax-Effekt: http://pixelcog.github.io/parallax.js/
Das funktioniert soweit ganz gut, solange ich die jeweiligen Bilder über ein Inhaltselement vom Typ "HTML" händisch einbinde:
HTML-Code:
<div class="parallax-window" data-image-src="files/path/to/my/image.jpg" data-parallax="scroll"></div>
Eleganter wäre es natürlich ein Bild über ein Inhaltselement vom Typ "Bild" einzufügen, hierzu müsste dann aber das Template ce_image.html5 angepasst werden. Das div einzubinden gelingt mir noch, nicht aber der Teil:
Code:
data-image-src="files/path/to/my/image.jpg" data-parallax="scroll"
Wie ist hier das korrekte Vorgehen. Herzlichen Dank für Tipps und Hinweise.
Hier noch der Code des Templates ce_image.html5:
PHP-Code:
<?php $this->extend('block_searchable'); ?>
<?php $this->block('content'); ?>
<figure class="image_container"<?php if ($this->margin): ?> style="<?= $this->margin ?>"<?php endif; ?>>
<?php if ($this->href): ?>
<a href="<?= $this->href ?>"<?php if ($this->linkTitle): ?> title="<?= $this->linkTitle ?>"<?php endif; ?><?= $this->attributes ?>>
<?php endif; ?>
<?php $this->insert('picture_default', $this->picture); ?>
<?php if ($this->href): ?>
</a>
<?php endif; ?>
<?php if ($this->caption): ?>
<figcaption class="caption"><?= $this->caption ?></figcaption>
<?php endif; ?>
</figure>
<?php $this->endblock(); ?>
Lesezeichen