zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden Video soll nur abspielen, wenn DIV eingeblendet ist

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 04.06.2018, 19:27
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.04.2005
Beiträge: 68
Fanello befindet sich auf einem aufstrebenden Ast
Standard Video soll nur abspielen, wenn DIV eingeblendet ist

Liebe XHTML-Gemeinde

Ich bin an einem kleinen Studium-Projekt dran.
https://www.james-3.com/index.php?article_id=10

Diese Seite besteht aus vier Divs, die jeweils so gross sind wie das Browserfenster. Zwei Divs davon haben ein Video, das ebenfalls auf die gesamte Browserfenster-Grösse dargestellt wird.
Ein anderes Div hat im Moment noch ein Bild drin von einer Fake-Bankseite. Später sollen da dann die Beträge mit einem Counter (z.B. https://codepen.io/jakubtursky/pen/vEwZop ) auf 0 zurück.

Ist es nun möglich, dass das aktuell sichtbare Video stoppt, sobald zum nächsten Div gescrollt wird? Wenn dann da auch ein Video ist, soll dieses Video abgespielt werden. Wenn da der Counter ist, soll er starten.
Sobald zum nächsten Div gescrollt wird, soll das Video an der zuletzt gestoppten Stelle weitermachen (oder der Counter soll weiterzählen).

Ich kenne mich mit Javascript nicht aus, lerne aber gerne dazu. Daher wäre ich froh, wenn ich wenigstens einen Hinweis bekommen könnte, wonach ich suchen soll.

Danke
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 05.06.2018, 09:18
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.942
cloned ist ein Lichtblickcloned ist ein Lichtblickcloned ist ein Lichtblickcloned ist ein Lichtblickcloned ist ein Lichtblick
Standard

Schreckliche Seite, ein perfektes Negativbeispiel dafür, dass man das Scrollen des Users nicht beeinflussen soll. Das springt unkontrolliert herum und ich würde auf der Seite keine 5 Sekunden bleiben wollen.
Aber genug OT: Dein Problem lässt sich hervorragend mit intersectionObserver lösen, damit kannst du feststellen, wenn ein Element den Browserbereich verlässt, betritt, oder zu x% sichtbar ist.
https://developer.mozilla.org/en-US/...n_Observer_API

Sobald dein div also zu 100% sichtbar ist dann spielst du das Video drinnen ab, ist es nicht mehr sichtbar stoppst du es einfach. (mit video.play() und video.pause() )
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 05.06.2018, 10:43
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 27.04.2005
Beiträge: 68
Fanello befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von cloned Beitrag anzeigen
Schreckliche Seite, ein perfektes Negativbeispiel dafür, dass man das Scrollen des Users nicht beeinflussen soll. Das springt unkontrolliert herum und ich würde auf der Seite keine 5 Sekunden bleiben wollen.
Aber genug OT: Dein Problem lässt sich hervorragend mit intersectionObserver lösen, damit kannst du feststellen, wenn ein Element den Browserbereich verlässt, betritt, oder zu x% sichtbar ist.
https://developer.mozilla.org/en-US/...n_Observer_API

Sobald dein div also zu 100% sichtbar ist dann spielst du das Video drinnen ab, ist es nicht mehr sichtbar stoppst du es einfach. (mit video.play() und video.pause() )
Vielen Dank für den Tipp mit intersectionObserver.

Zur Seite: wie gesagt ist es ein Studienprojekt. Der User soll da nicht navigieren oder scrollen können. Es wird an einer Ausstellung gezeigt und da wird ein Monitor aufgestellt der das dann zeigt
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 20:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Header entfernen tripple CSS 17 15.06.2010 16:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 11:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 20:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:09 Uhr.