Slider soll bei Seitenwechsel nicht neu starten

Bitte alle templatebezogenen Beiträge in diesem Forum veröffentlichen.
User avatar
Uwe367
Posts: 988
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Slider soll bei Seitenwechsel nicht neu starten

Post by Uwe367 » Thu 14. Aug 2014, 21:35

Hallo zusammen,

Ich bin gerade dabei lokal eine neue Seite aufzubauen und möchte den fotorama-slider http://fotorama.io/ als Bildslider für den Header verwenden. Jedoch sollte das ganze so aussehen, daß der Slider bei einem Seitenwechsel nicht mit dem ersten Bild neu startet, sondern, wenn die Unterseite geöffnet ist, an der Position weiter läuft, an der der Klick zum Seitenwechsel durchfgeführt wurde.
Ich hab mal ein wenig gegoogelt und das muß wohl mittels eines Cookies gelöst werden welches die Postion des Sliders beim Seitenwechsel speichert.
Ok... jquery Cookie Plugin https://github.com/carhartl/jquery-cookie gibts ja nun auch, aber wie bekomme ich die beiden miteinander verknüpft so daß das gewünschte Ergebnis erzielt wird?

Vielleicht hat ja jemand eine Idee oder sowas in der Art schonmal realisiert. Ich würd mich über Hilfe freuen :)

Gruß
Uwe

User avatar
kukki
Posts: 1666
Joined: Mon 7. Feb 2005, 20:02
Location: Berlin Köpenick
Contact:

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by kukki » Fri 15. Aug 2014, 09:11

Wenn ich eine solche Lösung anstreben würde, fiele mir sofort ein, diesen Slider "außerhalb" von phpWCMS laufen zu lassen, damit slidert das Teil unbehelligt, und slidert und slidert und slidert und slidert und .... erfordert ein wenig Anpassung im Layout im Headerbereich bzw. im body: Stichwort "doppelter Hintergrund". Wenn ein doppelter grafischer Hintergrund geht, warum dann nicht auch ein Slider da hineinpacken - wäre also möglich - mit einfacheren Boardmitteln :?:
Lieber arm dran als Arm ab!

meine historische Website: Jagdgeschwader 300 1.9.0 RC2
kukki's SpIeLwIeSe V.1.9.8 R549 responsive

User avatar
update
Moderator
Posts: 6394
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by update » Fri 15. Aug 2014, 09:17

sag an!
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

nameless1
Posts: 847
Joined: Sun 27. Apr 2008, 23:22

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by nameless1 » Fri 15. Aug 2014, 09:27

Uwe367 wrote:Jedoch sollte das ganze so aussehen, daß der Slider bei einem Seitenwechsel nicht mit dem ersten Bild neu startet, sondern, wenn die Unterseite geöffnet ist, an der Position weiter läuft, an der der Klick zum Seitenwechsel durchfgeführt wurde.
schau dir mal pjax an. einfach in der anwendung und sollte sich perfekt für deine anforderung eignen. die verwendung eines cookies ist hier mit kanonen auf spatzen schießen. pjax lädt nur den von dir definierten bereich einer seite neu und ändert dazu oben die url damit auch die vor und zurück funktionalität des browsers greift.

wir könnten dir das grundprinzip fix in phpwcms bauen und du mußt es nur noch stylen -> pm
Last edited by nameless1 on Fri 15. Aug 2014, 10:59, edited 1 time in total.

User avatar
kukki
Posts: 1666
Joined: Mon 7. Feb 2005, 20:02
Location: Berlin Köpenick
Contact:

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by kukki » Fri 15. Aug 2014, 10:12

Ich hatte mir auch schon mal solche "Spielereien" - allerdings eher auf CSS-Basis - angesehen, und wieder verworfen, weil mir persönlich zu aufdringlich.
Anbei eine Linklinste aus meinen Favoriten:
Lieber arm dran als Arm ab!

meine historische Website: Jagdgeschwader 300 1.9.0 RC2
kukki's SpIeLwIeSe V.1.9.8 R549 responsive

User avatar
Oliver Georgi
Site Admin
Posts: 9560
Joined: Fri 3. Oct 2003, 22:22
Location: Moscow, Russia
Contact:

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Oliver Georgi » Sat 16. Aug 2014, 07:39

Cookie ist hier die praktikabelste Lösung. Geringster Aufwand.

Dafür nutzt Du Fotoramas Event Listeners: fotorama:show oder fotorama:showend

Ich weiß nicht, wie Du Fotorama aufrufst, Du musst es dann aber manuell tun (an data-auto="false" denken). Das Grundprinzip mit Cookie ist dann:

Code: Select all

$(function() {
    var fotoramaCookieName = 'fotoramaslide';
    var fotoramaSlide = $.cookie(fotoramaCookieName);
    var fotoramaOptions = {
        // Fill in your default options here
    };
    if(fotoramaSlide !== 'undefined') {
        fotoramaOptions.startindex = parseInt(fotoramaSlide,10);
    }
    $('.fotorama').on(
        'fotorama:show', 
        function() {
            $.cookie(fotoramaCookieName, fotorama.activeFrame);
        }
    ).fotorama(fotoramaOptions);
});
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон

User avatar
Uwe367
Posts: 988
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Uwe367 » Sat 16. Aug 2014, 07:57

Hallo Oliver,
Besten Dank für diesem Lösungsansatz.
Ich rufe den Slider im Haupttemplate im Adminbereich unter Vorlage folgendermaßen auf:

Code: Select all

<div id="header"><div class="fotorama" style="float: left; margin-left: 0;" data-width="1024" data-height="319" data-nav="false" data-autoplay="true" data-arrows="false" data-transition="crossfade" data-transitionduration="3000" data-stopautoplayontouch="false">
  <img src="images/1.jpg">
  <img src="images/2.jpg">
  <img src="images/3.jpg">
  <img src="images/4.jpg">
  <img src="images/5.jpg">
  <img src="images/6.jpg">
</div>
Den Slider baue ich absichtlich auf diese Weise (also manuell ohne CP und ohne Template) ein damit später keiner der Redakteure darin rumwurschtelt.

User avatar
Oliver Georgi
Site Admin
Posts: 9560
Joined: Fri 3. Oct 2003, 22:22
Location: Moscow, Russia
Contact:

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Oliver Georgi » Sat 16. Aug 2014, 08:06

Nun ja, die data-options packst Du in die Default Options von fotoramaOptions. Zum Rest sage ich mal nix, Style-Attribut und Klasse, float left im Header — muss ich nicht verstehen.
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон

User avatar
Uwe367
Posts: 988
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Uwe367 » Sat 16. Aug 2014, 08:14

Oliver Georgi wrote:Zum Rest sage ich mal nix, Style-Attribut und Klasse, float left im Header — muss ich nicht verstehen.
Sind noch ein paar Artefakte aus den Versuchen den Slider richitg einzubauen. Wird in der finalen Version nur noch über eine CSS Klasse ohne Style Attribut laufen :wink:
Danke dir für deine Hilfe :)

User avatar
Uwe367
Posts: 988
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Uwe367 » Sun 17. Aug 2014, 13:51

Bin heute erst wieder dazu gekommen das ganze auszuorbieren und da scheiterts wieder mal an meinen mangelnden Kenntnissen :cry:

Egal auf welche Weise ich auch versuche die data-options hier einzutragen,

Code: Select all

var fotoramaOptions = {
// Fill in your default options here
 };
es wird ein Codefehler ausgegeben und somit kann die ganze Sache nicht funktionieren.
Leider hat auch Tante Google keinen richtigen Hinweis, jedenfalls hab ich keinen gefunden.

Würde sich jemand erbarmen und mir vielleicht noch ein kurzes Beispiel für die richtige Schreibweise geben?
Ich weiß.... ich bin ein schwieriger Fall...

User avatar
update
Moderator
Posts: 6394
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by update » Sun 17. Aug 2014, 14:18

wo trägst Du das denn ein?
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

User avatar
Uwe367
Posts: 988
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Uwe367 » Sun 17. Aug 2014, 14:29

Dieses...

Code: Select all

data-width="1024" data-height="319" data-nav="false" data-autoplay="true" data-arrows="false" data-transition="crossfade" data-transitionduration="3000" data-stopautoplayontouch="false"
soll da rein, also dort wo derzeit "// Fill in your default options here" steht

Code: Select all

var fotoramaOptions = {
// Fill in your default options here
 };
aber irgendwie schnalle ich das mit der richtigen Schreibweise nicht....

User avatar
update
Moderator
Posts: 6394
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by update » Sun 17. Aug 2014, 15:16

Das sollte doch im Prinzip so gehen:

Code: Select all

var fotoramaOptions = {
// Fill in your default options here
width: 800,
nav: false,
arrow: false,
transition: 'crossfade',
stopautoplayontouch: false
 };
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

User avatar
Oliver Georgi
Site Admin
Posts: 9560
Joined: Fri 3. Oct 2003, 22:22
Location: Moscow, Russia
Contact:

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Oliver Georgi » Sun 17. Aug 2014, 15:23

Je oh je, schon mal was von JSON Schreibweise gehört?

Code: Select all

jsonObject = {
    key: 'value',
    'key': 'value',  // wenn unsicher, alles als String, außer Bool, Object, Function, Array
    keyBoolTrue: true,
    keyBoolFalse: false,
    keyNull: null,
    keyInt: 1234,
    keyFloat: 1.234,
    keyFunction: function(){},
    keyObject: {foo:true},
    keyArray: [1,2,3,'a','b','c']
}
Also

Code: Select all

// data-width="1024" data-height="319" data-nav="false" data-autoplay="true" data-arrows="false" data-transition="crossfade" data-transitionduration="3000" data-stopautoplayontouch="false"
// UND NICHT vergessen data-auto="false"
var fotoramaOptions = {
    width: 1024,
    height: 319,
    autoplay: true,
    nav: false,
    arrow: false,
    transition: 'crossfade',
    stopautoplayontouch: false,
    transitionduration: 3000
};
Und Dokumentation lesen, kommt immer gut? http://fotorama.io/customize/options/
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон

User avatar
Uwe367
Posts: 988
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Re: Slider soll bei Seitenwechsel nicht neu starten

Post by Uwe367 » Sun 17. Aug 2014, 15:38

Oliver Georgi wrote:Je oh je, schon mal was von JSON Schreibweise gehört?
Ja ich weiß... Bin halt ein schwieriger Fall., traue mich ja schon fast gar nicht mehr zu schreiben weils mir selbst peinlich ist :(
In der Doku hatte ich zwar gelesen, aber das hatte ich wohl übersehen und nein.. JSON Schreibweise sagte mir bisher noch nichts.


Trotzdem danke euch beiden.

Post Reply