Hallo,
ich habe in meine Typo3-Seite einen Nivo-Slider eingebaut. Die Bilder lädt er von dem folgenden HTML-Snippet aus einem HTML-Content-Element:
<div id="slider" class="nivoSlider">
<a href="#"><img src="fileadmin/.../test.jpg" alt="" title="Das ist der erste Test" /></a>
<a href="#"><img src="fileadmin/.../test2.jpg" alt="" title="Das ist der zweite Test" /></a>
</div>
Das funktioniert prima und einfach so. Der Capture-Text ist der title-Text. Ich würde gerne zwei Zeilen für den title-Text in zwei verschiedenen Schriftarten haben:
z.B.: (fett) "Es hat geklappt"
und in der Zeile drunter (font-weight:normal; font-family:andere_Schriftart😉 "Das ist der erste Test"
Wie kann ich das umsetzen?
Vielen Dank
Schöne Grüße
Das wird sehr wahrscheinlich nur über JavaScript machbar sein, da der NivoSlider das HTML-Markup ziemlich hart verändert und du deshalb erst nach der Initialisierung des Sliders das DOM entsprechend anpassen kannst.
Das habe ich befürchtet 😉 jeje. Danke für die schnelle Antwort.
VG
Mike
Sooo,
nachdem ich mit meinem JQuery-Snippet nur einen Teilerfolg erzielen konnte, habe ich für mich nun eine andere Lösung gefunden. Mittels "data-captionelem". Funktioniert like a Charme 😉
HTML:
<div id="slider">
<img src="fileadmin/test/test1.jpg" alt="" data-captionelem="#caption1" />
<img src="fileadmin/test/test2.jpg" alt="" data-captionelem="#caption2" />
</div>
<div id="caption1" class="testcaption">Das ist ein Test-Caption</div>
CSS:
.testcaption{
...
}