Slider mit Ken-Burns-Effekt

[stamm_vv]

Liebe Contao-Community

Bei meiner Website habe ich im Header einen Bild-Slider eingebaut. Ich möchte die Bilder jedoch dynamisch darstellen, am liebsten mit dem Ken-Burns-Effekt. Gibt es eine solche Erweiterung im Erweiterungskatalog?

Nach stundenlanger Suche und Recherche (auch hier im Forum) bin ich leider nicht fündig geworden...

Vielen Dank für eure Hilfe!

Grüsse,
Manuel (ein Contao-Neuling :-))

[marq]

Meinste sowas hier?

http://slippry.com/examples/pictures/

dieser wäre als eigenes Modul auch ziemlich einfach umzusetzen. Prinzipiell sogar auch ohne eigenes Modul sondern mit zwei eigenständige Templates für die Gallerie - oder oder oder...

[Niels H]

Wenn es mit Zoom sein soll, kann ich Smoothslides empfehlen:
http://kthornbloom.github.io/Smoothslides/

Den habe ich für diese Seite verwendet:
mein-zahnarzt.koeln

Gibt es aber nicht als Erweiterung. Müsstest Du manuell einbauen.

[xkoy]

Falls es noch jemand brsucht/sucht. Bei Vodefog gibts den Revolution Slider, da wäre Ken Burns mit dabei. Aber nicht gratis!

[Wian]

Für Contao2 gab es die Erweiterung Slideshow2 mit Ken Burns-Effekt. Leider gibt es die nicht für die Version 3. Wenn ich mal Zeit habe, werde ich beim Entwickler anfragen, was aus der Slideshow2 wird.

[Traumkunst]

Weil zu dem Thema wirklich nicht leicht was zu finden ist, grabe ich mal diesen alten Thread aus.

Weiß jemand noch sinnvolle Ken-Burns-Galerie-Alternativen?

Aktuell finde ich diese Situation:

Smoothslides v. kthornbloom
Bis jetzt die schönste Version. Da ich zwei verschiedene zoomIn-Effekte brauchte (einen sehr dezenten, einen etwas heftigeren) , musste ich das Javascript um eine neue Effekt-Variante erweitern, was aufgrund des sehr klar strukturierten Scripts aber kein Problem war. Nur, aus den Optionen heraus war das leider nicht steuerbar.

Es gibt aber mindestens zwei Schwierigkeiten bei dem Script:
1. Verwende ich die Navigationsbuttons (vor/zurück), dann wird beim jeweils folgenden Bild kein Effekt angewendet. Erst danach wieder.
2. Bei Verwendung eines einzelnen Bildes funktioniert das ganze nicht. Hintergrund dazu: Der User betritt eine Seite, dann soll in das Bild reingezoomt werden, und auf Maximal-Zoom einfach stehen bleiben. Also quasi Einmal-Draufzoomen, fertig. Das funktioniert hiermit leider nicht. Ich muss mit mindestens zwei Bildern arbeiten; kann natürlich zwei mal das gleiche Bild nehmen, aber der Effekt wird dann halt immer wiederholt.

Witzigerweise gibt es genau zu diesen zwei Wünschen Github-Issues, und zwar direkt die ersten/ältesten, die dazu reinkamen :-) Aber der Author scheint da in der Richtung nicht interessiert zu sein, die Issues sind schon von 2016.

Slippry v. booncon
Hier ist der Effekt viel zu heftig, und kann m.E. auch nicht wirklich gut gesteuert werden. Der Parameter "kenZoom" -- macht der eigentlich irgendwas? Bei mir kommt unabhängig von den Parameter-Einstellungen immer eine relativ heftige Kamerfahrt übers Bild; selbst wenn ich Negativ-Werte eingebe. Lediglich die Gesamtgeschwindigkeit ist wirklich steuerbar, aber wenn ich das sehr dezent einstelle, wird der Effekt stotterig. Das Script lebt vermutlich auch davon, dass es relativ hurtig arbeitet. Nichts für den Liebhaber dezenter Effekte, eher die Abteilung "ordentlich Gas geben!" :-)
Aber: Bei diesem Script kann ich mit einem einzelnen Bild arbeiten! Dann arbeitet das Script automatisch genau so, wie ich es bräuchte: Der Effekt wird einmal angewendet und endet dann, ohne Loop o.ä. Das ist natürlich super.

Contao Modul: RockSolid Slider
Der von mir gerne genutzte RockSolid-Slider bietet leider keinen KenBurns-Effekt. Es gibt immer mal Anfragen dazu im RockSolid-Forum, aber umgesetzt wurde das bisher nicht. Tatsächlich findet man bei entspr. Google Suche einen "KenBurns"-Skin für den RockSolid-Slider unter diesen Adressen:

https://www.snip2code.com/Snippet/17...-Rocksolid-sl/
https://gist.github.com/kikmedia/9bf...8e54e27ce9fc82

, allerdings bekomme ich das so "out-of-the-box" nicht ans Laufen, wenn ich den als "Custom Skin" einstelle; hab schon in den Slider-Optionen alles mögliche durchprobiert (versch. Bildgrößen, Transitions, alle möglichen Werte...), aber: da ken-burnt nix :-)

Contao Modul: RevolutionSlider
Habe ich keine Erfahrung mit, höre aber hin und wieder, dass das ein "Biest" sein soll, das teilweise nur schwer ans Laufen zu bekommen sein soll, schwer zu konfigurieren ist, gerne techn. Schwierigkeiten macht etc. So habe ich das zmdst. ab und zu mal mitbekommen. Da ich mit dem RockSolid-Slider sehr zufrieden bin, bestand auch nie Bedarf, das Ding auszuprobieren. Ok, aber jetzt muss eben Ken Burns... Dass der RevolutionSlider nur mit kostenpflichtiger Lizenz geht, wäre für mich kein Hinderungsgrund; bin nicht so "alles-muss-umsonst-sein" drauf; den RockSolid-Slider verwende ich auch i.d. lizensierten Fassung. Allerdings bietet der RS-Slider zumindest eine kostenfreie Version zum Testen. Das ist hier leider nicht der Fall. Und erst mal 70,- Euro ausgeben nur um festzustellen "ne, ist doch nicht so das gelbe vom Ei"... hmmm... so dicke haben wir's dann doch nicht ;-)

Vielleicht kennt jemand ja noch eine ganz andere Alternative, die sich sinnvoll in Contao einsetzen lässt? Also, muss natürlich kein Contao-Modul sein, Standalone, ggf. auf Basis jQuery, auch 100% OK...

Cool wären halt:
• Dezenter Zoom-In-Effekt (sowas wie Zoom von 100% auf 105% in 10 Sekunden - aber ruckelfrei :-)
• Single-Image-fähig

Viele Grüße,
Frank

[lucina]

Du wirst dem Slider die Klasse .rsts-skin-kenburns mitgeben müssen damit das läuft ... ;-)

[derRenner]

Hallo,

ich habe in einem (nicht-Contao)-Projekt den Vegas2 Slider im Einsatz ... vielleicht schaust du dir diesen mal an

aber...

Also, muss natürlich kein Contao-Modul sein, Standalone, ggf. auf Basis jQuery, auch 100% OK...

warum versuchst du dich dann nicht über die eine oder andere Github-Version

[re84]

Du wirst dem Slider die Klasse .rsts-skin-kenburns mitgeben müssen damit das läuft ... ;-)

Hallo liebe Lucina,
Wie kann man denn deinen Ken Burns Effekt zum Laufen bekommen? Ich verwende den aktuellsten Rock Solid Slider, habe deine CSS Datei verwendet, dem Slider auch die Klasse mitgegeben("kenburns" --> .rsts-skin-kenburns), als Animationstyp "Fade", als Slider Skin "Eigener" eingestellt. Leider faded er weiterhin nur die Bilder anstatt den gewünschten Effekt zu verwenden.
Hast Du da eine Idee? Wie hast Du das ganze zum Laufen bekommen?
Vielen Dank,
Robert

[Franko]

Unabhängig vom verwendeten Slider,
könnte man den Kern-Burns Effect auch mit purer CSS-Animation realisieren und dessen Dauer dann mit der jeweiligen Dauer der Slide-Transitions abstimmen:
Siehe: http://animista.net/play/background

[mlweb]

Nette Seite. Kannte ich noch nicht. Danke für den Link.

[planepix]

Unabhängig vom verwendeten Slider,
könnte man den Kern-Burns Effect auch mit purer CSS-Animation realisieren und dessen Dauer dann mit der jeweiligen Dauer der Slide-Transitions abstimmen:
Siehe: http://animista.net/play/background

Jupp war vor 2 tagen im Artikel von css tricks mit dabei.

https://css-tricks.com/css-animation-libraries/


Gesendet von iPhone mit Tapatalk

[Franko]

Jupp war vor 2 tagen im Artikel von css tricks mit dabei.

[re84]

Unabhängig vom verwendeten Slider,
könnte man den Kern-Burns Effect auch mit purer CSS-Animation realisieren und dessen Dauer dann mit der jeweiligen Dauer der Slide-Transitions abstimmen:
Siehe: http://animista.net/play/background

Vielen Dank für den Link. Klingt sehr interessant. Werde ich bestimmt mal verwenden.
Müsste es allerdings irgendwie hinbekommen mehrere Bilder hintereinander zu schalten. hmmm.... da vielleicht eine Idee wie man dies beispielsweise eim Rocksolid Slider implementieren kann?

[Franko]

Verstehe ich nicht
Zur Anzeige kannst Du jeden Slider verwenden - auch den Contao internen.
Lediglich pro Slide mußt Du dann via CSS die entsprechende Animation setzen ...