Zum Inhalt springen

Eigene Klasse im <img> bei bestimmten section_frame

Erstellt am 27. Juli 2015 · 3 Antworten · letzte Antwort am 28. Juli 2015

Tags: Inhaltselemente, Bilder, TYPO3 6.x, Frage

mimii ·

Hallo ins Forum,

ich erfasse ein CE "Bild" mit drei Bildern. Das CE erhält einen section_frame "box", die soweit auch um das Element rum gesetzt wird. Das etwas unübersichtliche HTML sieht nun so aus:

<div class="box">

<div class="csc-textpic csc-textpic-center csc-textpic-above">
<div class="csc-textpic-imagewrap">
<div class="csc-textpic-center-outer">
<div class="csc-textpic-center-inner">

<div class="csc-textpic-imagerow">
<div class="csc-textpic-imagecolumn csc-textpic-firstcol csc-textpic-lastcol">
<div class="csc-textpic-image csc-textpic-last">
<img width="493" border="0" height="400" alt="bild1" src="fileadmin/user_upload/bilder/bild_1.png">
</div>
</div>
</div>

<div class="csc-textpic-imagerow">
<div class="csc-textpic-imagecolumn csc-textpic-firstcol csc-textpic-lastcol">
<div class="csc-textpic-image csc-textpic-last">
<img width="548" border="0" height="300" alt="bild2" src="fileadmin/user_upload/bilder/bild_2.png">
</div>
</div>
</div>

<div class="csc-textpic-imagerow">
<div class="csc-textpic-imagecolumn csc-textpic-firstcol csc-textpic-lastcol">
<div class="csc-textpic-image csc-textpic-last">
<img width="101" border="0" height="200" alt="bild3" src="fileadmin/user_upload/bilder/bild_3.png">
</div>
</div>
</div>

</div>
</div>
</div>
</div>
</div>

Für eine bestimmte Animation benötigt nun jedes Bild eine eigene ID, um Sie im jQuery bzw. im CSS anzusprechen. Wie kann ich jedem Bild in den <img> Tag diese mitgeben, wenn section_frame "box" gewählt ist?
Super wäre auch noch, wenn die ganzen <div> mit "csc-textpic" außenrum dann auch gleich verschwinden würden, da ich sie in diesem Fall dann nicht benötige.

Danke für n Tipp un Gruß
mimii

Chrissli ·

Schau doch mal in den Typoscipt-Object Browser, evtl. lässt sich hier ein Wrap nutzen.
Ich könnte mir vorstellen, dass zb

tt_content.image.20.imageStdWrap.dataWrap = <div class="csc-textpic-imagewrap" style="width:{register:totalwidth}px;"> | </div>

entsprechend angepasst werden kann.
Ob hier die Parameter von FILES ( z.b. {file:current:uid} ) funktionieren weiß ich nicht, aber evtl. lässt sich hier mit {cObj:parentRecordNumber} etwas bewerkstelligen

mimii ·

Danke schon mal für deine Antwort,

soweit ich das aber erkenne, liegt der

 tt_content.image.20.imageStdWrap.dataWrap = <div class="csc-textpic-imagewrap" style="width:{register:totalwidth}px;"> | </div>

um alle Bilder rum, die in einem CE sind. Da ich aber jedes Bild einzeln ansprechen muss, ist das nicht brauchbar.

Ich probiers jetzt mal mit CSS über nth-child, ob ich hier was erreiche.

Danke und Gruß
mimii

Chrissli ·

Da du ja eh jQuery verwendest findet sich evtl. auch damit eine Lösung. Gibt aber bestimmt auch irgendwo einen passenden Wrap um das zu handhaben.