Bild und Text "sliden"

[Berliner]

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

[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.

[Berliner]

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

Danke erstmal

[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.

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.

[MiTsch]

Hallo, Berliner,

ändere mal deine CSS Anweisung wie folgt:

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

und:

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

Viele Grüße
MiTsch

[Berliner]

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

[wulf]

das problem liegt hier

.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.

[Merlin]

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

[Berliner]

das problem liegt hier

.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

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

[wulf]

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;}

[Berliner]

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

[wulf]

manchmal sollen ja bilder helfen. hier mal eine ansicht von chrome.
Screenshot_1.png
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.

[Berliner]

manchmal sollen ja bilder helfen. hier mal eine ansicht von chrome.
Screenshot_1.png
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