Sticky Video

Bewegt sich der Player beim scrollen der Website aus dem sichtbaren Bereich, wird das Video an den Browser angeheftet (Sticky Video). Der angeheftete Player kann auf der Seite beliebig positioniert werden. Probieren Sie es aus. Starten Sie das Video und scrollen Sie anschließend.

Player Demo (Sticky)


Je nach Bildschirmgröße - Mobile, Desktop skaliert das Sticky Element zu 30 bzw. 60% des Bildschirms.

sticky Parameter

Bei Initalisierung des Players können Sie mit sticky:true die Funktionalität aktivieren; oder Sie übergeben ein Konfigurationobjekt mit weiteren Einstellungen.


var  VideoPlayer =  new js3q({
        'data-id': 'c8dbe7f4-7f7f-11e6-a407-0cc47a188158',
        'container': 'player1',
        'sticky': true
 });
VideoPlayer.init();

Neben den Standardeinstellungen des Sticky Players können Sie auch das CSS manipulieren und die Standard Position verändern.


Mehr Beispiele zur Player Integration finden Sie auf unserer Github Seite.

Browser-Support

 

HTML5Chrome 34+
Firefox Android 41+
Firefox Desktop 42+
IE11+ Windows 8.1+
Edge Windows 10+
Opera Desktop
Safari iOS (in der Entwicklung)
FlashWird nicht unterstützt

Und ein bisschen Text zum scrollen.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Mit Nutzung unserer Angebots, stimmen Sie unseren Datenschutzbestimmungen zu.