MultiMediaSlider - Fotorama für CMSimple

[Gert]

Das Plugin MultiMediaSlider, das Fotorama für CMSimple bereitstellt, stand ja nun einige Jahre auf der Abschussliste, weil Fotorama jQuery benötigt und ich jQuery eigentlich loswerden will. Aber da ist ja noch das Standard-Plugin Pagemanager, das auf dem jQuery Plugin jsTree beruht. Der Pagemanager funktioniert hervorragend, und so bin ich viel zu faul, einen neuen Pagemanager zu programmieren, der kein jQuery benötigt.

Und so gibt es ein jQuery 3.0.0 für den Pagemanager (jquery_cmsimplecore.js), und damit funktioniert auch Fotorama. Sowohl jsTree als auch Fotorama werden seit vielen Jahren nicht mehr aktualisiert und brauchen somit auch kein jQuery grösser 3.0.0. Wenn jemand unbedingt ein Plugin betreiben will, das jQuery höher als 3.0.0 braucht, muss er selbst dafür sorgen, dass sein benötigtes jQuery geladen wird. CMSimple jedenfalls unterstützt jQuery nicht mehr und ist somit vor Überraschungen aus dieser Ecke geschützt.

Und somit sieht es nun wieder gut aus für den MultiMediaSlider, Fotorama wird seit mehr als 10 Jahren nicht mehr weiterentwickelt, die aktuelle Version 4.6.4 ist aus 2015. Von da her sind also auch keine Überraschungen mehr zu befürchten, jQuery 3.0.0 bleibt für den Pagemanager Bestandteil von CMSimple, und solange wird auch das Plugin MultiMediaSlider laufen.

Also habe ich mich mal wieder mit dem MultiMediaSlider beschäftigt, und dabei sind mir 2 Dinge aufgefallen:

1. Fotorama bietet keine Funktion, die die Slideshow bei mouseover unterbricht und bei mouseout wieder aktiviert. Es gibt nur stopautoplayontouch, und mouseover wird nicht als touch gewertet. Ein Klick auf den Slider oder auf ein Vorschaubild unterbricht die Slideshow, und sie kann nur durch ein Neuladen der Seite mittels Browser-Button wieder gestartet werden. Da muss man selbst drauf kommen, Fotorama bietet dafür keinen Button an.

Es gibt aber JavaScript Lösungen, die eine Unterbrechung der Slideshow bei mouseover und eine Fortsetzung bei mouseout bewirken.

2. Die Pfeile für das vorige und das nächste Bild sind im Original sehr prominent und somit nach meiner Auffassung störend platziert. Diese Buttons und der Vollbild Button haben ausserdem einen neutralen Hintergrund und sind bei manchen Bildern schlecht zu sehen, deshalb habe ich ein wenig mit dem CSS herumgespielt.

-----------------------------------

Da ich keine neue Version herausbringen möchte, ohne dass diese Probleme und deren Lösungen hier diskutiert wurden, habe ich ein paar Seiten in meiner CMSimple Demo angelegt, mit 2 Demoseiten und 2 Seiten mit den Codes für JavaScript und CSS:

https://www.ge-webdesign.de/demotpl/?Ti ... ediaSlider

Meine Fragen sind:

1. Findet Ihr das Originalverhalten von Fotorama zur Unterbrechung der Slideshow besser, oder mouseover / mouseout?

2. Wie findet Ihr die Anordnung der Pfeile für das vorige und das nächste Bild unten links und unten rechts?

Viel Spass - Gert

[Gonzo Gates]

Hallo Gert,

als Erstes: Eigendlich brauche ich den MultiMediaSlider nicht und ich weiß auch nicht, ob ich ihn mal getestet habe. Über jQuery hatten wir uns auch mal kurz unterhalten und bei ist V4.0.0 aktiv. Übrigens benutze ich jQuery für meinen Titelumschalter, wenn ein CMSimple-Tab im Browser inaktiv ist. Da steht dann im 2 Sekundentakt wechselnd:"Zurück zu..." - "${Seitentitel}" - "Mach schon!!!". Ist nur eine Spielerei.

Zur Demoseite 'Stop durch Aktion - das Standardverhalten': Vieleicht habe ich was am Auge, aber in der Slideshow kann ich oben links einen 'Play-Button' sehen, auf den ich klicken kann, damit die Show wieder beginnen kann. Hast du den nachträglich eingefügt? Sieht auch so aus, dass dieser einen Reload der Seite macht. In der 'Vergrößern'-Ansicht ist er nicht mehr vorhanden und die Show steht dann auch still. Nix Slider. Per Sitenreload im Broser kommt man wieder zur Gesamtseitenansicht zurück.

Zur Demoseite 'Stop durch mouseover': Als ich dein NewsTicker-Plugin ausprobiert hatte (Gebrauche ich jetzt nur noch in meiner Testsubsite unterhalb einer Gallerie), fand ich es gut, dass man den Tickertext mit mouseover anhalten kann. Das kann ich auch auf deine Veränderung im MultiMediaSlider übertragen. Mir gefällt es, denn dann muss man nicht mehr auf 'Play' klicken. Aber: Wenn auf 'Vergrößern' oben rechts geklickt wird, dann reicht es nicht den Mauszeiger nach unten auf die Thumbnails zu ziehen, sondern man muss den Zeiger aus dem Browserfenster herausziehen, damit die Show weiter geht. Per Sitenreload im Broser kommt man wieder zur Gesamtseitenansicht zurück oder man nimmt den 'Minimieren'-Button.

Unterm Strich: Stop mit mousover finde ich besser oder wie meine Frau manchmal sagt: guter (Weil sie es als Kleinkind so gesagt hatte). Zu den Pfeilen: Ich denke, dass eine Anordnung mittelinks und mitterechts besser wäre ( Dann wohl /*top: auto!important;*/ bottom: auto!important;), denn, nehmen wir an, dass der Mauszeiger rel. mittig positioniert ist, ein diagonaler Weg länger ist, als ein horizontaler. Das sehe es vor dem Hintergrund so, dass nicht alle Benutzer ihre Mausgeschwindigkeit auf AK konfiguriert haben, so wie ich. Und die Knöppies könnten etwas größer sein.

Gruß
Gonzo

[Gert]

Zur Demoseite 'Stop durch Aktion - das Standardverhalten': Vieleicht habe ich was am Auge, aber in der Slideshow kann ich oben links einen 'Play-Button' sehen, auf den ich klicken kann, damit die Show wieder beginnen kann. Hast du den nachträglich eingefügt?

Hallo Gonzo, ja, das war ein erster Versuch, dem Besucher etwas anzubieten, womit er die Slideshow wieder in Gang bringen kann. Inzwischen bin ich da etwas weiter gekommen:

https://www.ge-webdesign.de/demotpl/?Ti ... op_Buttons

Sieht auch so aus, dass dieser einen Reload der Seite macht. In der 'Vergrößern'-Ansicht ist er nicht mehr vorhanden und die Show steht dann auch still. Nix Slider. Per Sitenreload im Broser kommt man wieder zur Gesamtseitenansicht zurück.

Genau das sind so die Ungereimtheiten beim Standardverhalten. Das Klicken auf den Fullsize Button ist eine Aktion, die Slideshow stoppt also. Jetzt müsste ich die Seite neu laden, um die Slideshow wieder zu starten, lande dann aber wieder auf der Website. Die automatisch Slideshow funktioniert also nur in der mouseover Variante, ansonsten ist die Fullsize Ansicht nur zum Betrachten einzelner Bilder in gross da.

Ich finde die mouseover Variante auch am bequemsten, es gibt aber auch die Ansicht, dass sich auf einer inhaltsorientierten Website nichts bewegen soll, was nicht vom Besucher ausgelöst wird, wegen der Ablenkung vom wesentlichen.

Mal sehen, was mir noch so einfällt

Gert

[Gonzo Gates]

Hallo Gert,

zu deiner oben genannten Demo: Wenn ich den Slider starte, wenn ich auf 'Play' klicke, dann geht es los. Klicke ich auf ein Bild, dann erscheint sofort das nächste Bild. Dann ruht aber erstmal der Slidersee still, bis ich wieder auf 'Play' klicke.

Wenn jemand meint, dass er ein sofortiges Sliden der Bilder beim Aufruf seiner Seite nicht möchte, weil er meint, dass es störend für seinen Seiteninhalt ist, dann sollte dieser Jemand MultiMediaSlider so konfigurieren, dass es nicht passiert. Wenn das nicht möglich ist, dann könnte dieser Jemand einen Hinweistext in die Seite schreiben wie:"Wenn du hier keine Slideshow haben willst, dann klicke auf das Bild und beruhige dich." oder er bindet eine FotoPro Gallerie in die Seite ein. Dann ist Ruhe.

Aus meiner Sicht ist MultiMediaSlider dafür gedacht seine photografischen Eindrucke von Gegenden, in denen man war, Erignisse, die man Erlebt hat oder mein Auto, dass ich verkaufen möchte zu schildern. Da kann die Show auch mal sofort losgehen, wenn der Eingangstext stimmig ist

Ein Stück weit hast du Recht, denn wenn ich irgendwo ewas lese und eine Animation ist in den Text eingebunden, dann scrolle ich den Inhalt so hin, dass mich dieses 'Geflimmere' nicht nervt.

Gruß
Gonzo

[Gert]

Wenn ich den Slider starte, wenn ich auf 'Play' klicke, dann geht es los. Klicke ich auf ein Bild, dann erscheint sofort das nächste Bild.

Oder das vorige, je nach dem, wo Du hinklickst. Du kannst Dir auch eines aus den Vorschaubildern aussuchen, und wer das aktuelle Bld länger sehen will, nimmt den Stop-Button.

Dann ruht aber erstmal der Slidersee still, bis ich wieder auf 'Play' klicke.

So soll es sein. Wer in den Slider eingreift, will ihn normalerweise anhalten, um sich ein Bild genauer anzusehen, egal ob er das vorige oder das nächste Bild aufruft oder sich eines aus den Vorschaubildern aussucht. Kann man aber auch anders konfigurieren (data-stopautoplayontouch="false").

Ist halt wie bei einem Video, das kann man auch auf Autoplay konfigurieren oder nicht, und wenn man reinklickt, hält es an,

Gert