Bild und Text "sliden"

Liebe Forengemeinde,

leider hat meine Suche hier nicht wirklich viel ergeben - entweder ist mir die Fachsprache, als Anfänger mit einem CMS, zu hoch, oder trifft nicht wirklich meine verzweifelte Suche.
Folgendes versuche ich umzusetzen:

ich möchte folgendes auf einer Seite (Inhaltselemente in einem "Content-Slider" als Akkordeon-Einzelelement) umsetzen. Das bedeutet, dass "A" wie hier mit Bild und umgebenen Text eingeblendet wird, und dann "B", "C", usw. folgt.

Entweder habe ich einen Denkfehler, oder vielleicht fehlt mir eine Erweiterung, mit der man meine Vorstellungen unter 3.1.x umsetzen könnte? Der angehängte Screen-Shot zeigt mal die derzeit von mir verwendete Möglichkeit.

Für einen kleinen Stubs oder Hinweise wäre ich wirklich sehr dankbar.

Beste Grüße aus Berlin, Der Berliner

Der Slider ist doch schon eine art Accordeon. Wieso machst denn da noch mal ein Accordeon rein?

Mach Contao-Slider (Umschlag-Anfang) ArtikelA, B & C zwischen Contao-Slider (Umschlag-Ende)
Mit Css formatieren und fertig ist der Slider ;)

Die Konfiguration (Richtung, Geschwindigkeit, Verzögerung etc.) ist so wie ich mich von anderen Slidern erinnere im Umschlag-Anfang.

..vielen Dank für den Hinweis - Werde ich mal von der Seite heranarbeiten :)

Danke erstmal :)

Zitat:

---

Zitat von ciaobello

Der Slider ist doch schon eine art Accordeon. Wieso machst denn da noch mal ein Accordeon rein?

Mach Contao-Slider (Umschlag-Anfang) ArtikelA, B & C zwischen Contao-Slider (Umschlag-Ende)
Mit Css formatieren und fertig ist der Slider ;)

Die Konfiguration (Richtung, Geschwindigkeit, Verzögerung etc.) ist so wie ich mich von anderen Slidern erinnere im Umschlag-Anfang.

---

Der Ansatz war genau der richtige! Danke noch mal ;)

Allerdings tut sich jetzt ein weiteres Problem auf - FireBug hilft mir hier anscheinend nicht weiter *grummel*

Der Text, ich gehe mal von "ce_text block" aus, schneidet Buchstaben ab - Viel schlimmer jedoch, dass er sich nach rechts, mit jedem weiteren Artikel (erkennbar an den "Data-Index") verschiebt.. und somit auf der rechten Seite des Slider-Wrapper immer mehr des vorhergehenden Textes stehen lässt...
Gut erkennbar ist das hier ...

Ich hab grad keine Peilung, wo genau ich ansetzen sollte... *grummel*
Vielleicht hat jemand das gleiche Problem gehabt - oder ein einfaches "Mit-der-Nase-drauf-stubsen" wäre schon hilfreich ;)

Vielen Dank schon mal im Voraus,

Beste Grüße aus Berlin, der Berliner.

Hallo, Berliner,

ändere mal deine CSS Anweisung wie folgt:

Code:

---

.content-slider
    overflow: hidden;
    position: relative;
    visibility: hidden;
    width: 600px;

---

und:

Code:

---

.mod_article
    margin-left: 0;
    margin-right: 0px;
    width: 680px;

---

Viele Grüße
MiTsch

Hallo MiTsch,

vielen Dank für die schnelle Antwort.
Der erste Tip, mit .mod_article hat ein wenig geholfen, so wird zumindest nicht gleich beim Starten des Slider der Text abgeschnitten. :)

Allerdings macht der Slider immer noch, was er will :) ...


<div class="ce_sliderStart block">
<h1>Ausgewählte Heilsteine - von A bis Z</h1>
<div class="content-slider config_4000_3000_0_1" style="visibility: visible;">
<div class="slider-wrapper" style="width: 4080px;">
<div class="ce_text block" style="width: 680px; left: 0px; transition-duration: 3000ms; transform: translateX(-680px);" data-index="0">
<div class="ce_text block" style="width: 680px; left: -680px; transition-duration: 3000ms; transform: translateX(-680px);" data-index="1">
<div class="ce_text block" style="width: 680px; left: -1360px; transition-duration: 3000ms; transform: translateX(-680px);" data-index="2">
<div class="ce_text block" style="width: 680px; left: -2040px; transition-duration: 3000ms; transform: translateX(-680px);" data-index="3">
<div class="ce_text block" style="width: 680px; left: -2720px; transition-duration: 3000ms; transform: translateX(-680px);" data-index="4">
...


Leider finde ich weder in der "Default-" noch "Basic-" CSS unter Themes im BE die entsprechenden Einträge zu "ce_text block".
Vielleicht lieg ich ja falsch, aber irgendwo muss das doch definiert sein - vor allem diese "automatische Verschiebung" (ich denke, das ganze Problem besteht hier - rot markiert - ?) ?

Besten Dank schon mal, Der Berliner

das problem liegt hier

Code:

---

.mod_article *[class*="mod_"]{padding-left: 10px;padding-right: 10px;}

---

wenn das padding auf 0 gesetzt wird, würde der slider passen, aber als loptimale lösung würde ich es nicht gerade bezeichnen.

Zitat:

---

Zitat von Berliner

Leider finde ich weder in der "Default-" noch "Basic-" CSS unter Themes im BE die entsprechenden Einträge zu "ce_text block".
Vielleicht lieg ich ja falsch, aber irgendwo muss das doch definiert sein - vor allem diese "automatische Verschiebung" (ich denke, das ganze Problem besteht hier - rot markiert - ?) ?

Besten Dank schon mal, Der Berliner

---

die roten Einträge werden bestimmt vom eingesetzten Javascript eingefügt und somit stehen die in keinen Template.

LG Jens

Zitat:

---

Zitat von wulf

das problem liegt hier

Code:

---

.mod_article *[class*="mod_"]{padding-left: 10px;padding-right: 10px;}

---

wenn das padding auf 0 gesetzt wird, würde der slider passen, aber als loptimale lösung würde ich es nicht gerade bezeichnen.

---

Hallo wulf,

woher hast du denn diese "Daten" - ich finde diese irgendwie nicht via Firebug? (Sind es vielleicht "System-Erzeugte" Seiten-Steuerungen?)
Abgesehen davon wird anscheinend weder Basic.css noch Default.css wirklich geladen - das alte Problem, immer nur system-erzeugte css-dateien *grummel*
Auch wenn ich die Daten händisch in .mod_article eintrage, bewirkt dieses nichts :(

Zitat:

---

Zitat von Merlin

die roten Einträge werden bestimmt vom eingesetzten Javascript eingefügt und somit stehen die in keinen Template.

LG Jens

---

Oje... JS... aber danke dir für den Tip, wird mal diesbezüglich das Forum durchforsten.

LG, Berliner

die daten werden mir in den dev-tools von chrome, aber auch im firebug angezeigt und sind bestandteil vom layout-builder oder grid.css.
du kannst sie ja eifach mal mit !important überschreiben, dann solltest du eigentlich den effekt sehen.
.mod_article *[class*="mod_"]{padding-left: 0px!important;padding-right: 0px!important;}

Hallo wulf,

vielen Dank für die Antwort.
Habe es mal so probiert, wie du empfohlen hast - in die Basic.css und Default.css folgenden Eintrag:

Text innerhalb des Slider
.mod_article *[class*="mod_"] {
padding-left: 0px!important;padding-right: 0px!important;
}

Leider keinerlei Erfolg - Die Verschiebung mit jeder weiteren Einblendung bleibt bestehen und ab der 2. Einblendung auch ein Abschneiden des Textes an der rechten Seite.
Trotzdem mal eine Nachfrage: dieses " *[class*="mod_"] " spricht alle Klassen an, die mit mod_ beginnen?

Beste Grüße, Berliner

manchmal sollen ja bilder helfen. hier mal eine ansicht von chrome.
Anhang 11622
wenn margin-left und margin-right deaktiviert sind, würde der slider fast vernünftig funktionieren. eine lösung ist es aber nicht, da der backlink dann rumspackt.

Zitat:

---

Zitat von wulf

manchmal sollen ja bilder helfen. hier mal eine ansicht von chrome.
Anhang 11622
wenn margin-left und margin-right deaktiviert sind, würde der slider fast vernünftig funktionieren. eine lösung ist es aber nicht, da der backlink dann rumspackt.

---

*lach* danke...

..auch danke vorerst für deine "bildliche Ansicht".
Leider kann ich es derzeit nicht nachvollziehen, da ich nach der Installation von "dkCaroufredsel Slider" nicht mehr ins BE komme und auch die Webseite nicht mehr geladen wird. (Hatte gehofft, damit alle Probleme des "internen Sliders" umgehen zu können).

Dein Screenshot zeigt die Veränderungen in einer "automatisch erzeugten" css.Datei - Somit ist leider derzeit für mich nicht klar, ob und welche Änderungen in der basic.css und default.css greifen.

Ich danke dir trotzdem erst einmal für dein Hilfe und Mühe - wenn alles wieder läuft, meld ich mich :)

Beste Grüße aus Berlin