Hallo Leute,
hab mir mit ContentElements einen PictoSlider erstellt der soweit auch gut funktioniert.
Jetzt möchte ich den aber noch etwas erweitern, und zwar wenn ich im PictoSlider auf ein Bild klicke möchte ich das sich eine Modalbox öffnet das geht auch schon...
Aber wie wird jetzt die description
und der title
vom Bild in die Modalbox übergeben irgendwas fehlt mir da und ich stehe richtig auf dem Schlauch.
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
xmlns:cb="http://typo3.org/ns/TYPO3/CMS/ContentBlocks/ViewHelpers" data-namespace-typo3-fluid="true">
<cb:asset.css identifier="content-block-css-rcdesign-rcdesign/pictoslider" file="Frontend.css" />
<cb:asset.script identifier="content-block-js-rcdesign-rcdesign/pictoslider" file="Frontend.js" />
<section class="py-8 py-md-4 bg-eberl-shadow">
<div class="container justify-content-center">
<f:if condition="{data.assets}">
<div class="swiper pictoSwiper">
<div class="swiper-wrapper">
<f:for each="{data.assets}" as="asset" iteration="iteration">
<div class="swiper-slide">
<f:image image="{asset}" loading="lazy" width="auto" height="auto" data-bs-toggle="modal"
data-bs-target="#exampleModal" />
</div>
</f:for>
</div>
</div>
</f:if>
</div>
</section>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">{file.titletext}</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
{file.description}
</div>
</div>
</div>
</div>
</html>