Hintergrundmusik pausieren
bearbeitet von
Aloha ;)
> > Und das "abfragen, ob Section zu sehen ist" funktioniert wie genau? Das ist doch gerade mit des Pudels Kern...
>
> In dem er die Koordinaten der Sektion ermittelt und mit dem Bildschirm-Offset vergleicht?
Soweit, so klar. Es wäre allerdings hilfreich gewesen, dazu zu sagen **wie** man das macht (denn genau das war meine Frage).
Ich wusste es jedenfalls nicht auswendig und musste zuerst nachlesen.
Jedenfalls sollte folgende Funktion dabei helfen, die Koordinaten der Sektion mittels JavaScript zu ermitteln:
~~~js
function getPosition(element) {
var xPosition = 0;
var yPosition = 0;
while(element) {
xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
element = element.offsetParent;
}
return { x: xPosition, y: yPosition };
}
~~~
([Quelle](http://www.kirupa.com/html5/get_element_position_using_javascript.htm))
An den TO:
Du kannst das scroll-Event des window abfangen und in der Event-Listener-Funktion die Wiedergabe nur dann pausieren, wenn `getPosition(document.getElementById("section4"))` entsprechende Werte liefern, die zwischen `window.pageXOffset` und `window.pageXOffset + window.innerWidth` liegen bzw. zwischen `window.pageYOffset` und `window.pageYOffset + window.innerHeight`.
Und bitte, bitte, frag mich nicht nach einer JQuery-Lösung - wer JQuery verwenden möchte, sollte dafür JavaScript beherrschen - und dann sollte es ein leichtes sein, den JavaScript-Lösungsweg in JQuery umzusetzen. Oder einfach JavaScript zu benutzen. JQuery ist ein sinnvolles JavaScript-Tool, aber kein Selbstzweck. Insbesondere sind viele Argumente dafür, JQuery einzusetzen, inzwischen obsolet, weil der Sprachstandard entsprechende Funktionalitäten inzwischen auch so unterstützt.
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
Erreichbar manchmal im Self-TS (ts.selfhtml.org) oder sonst - wenn online - auf dem [eigenen TeamSpeak-Server](http://www.tsviewer.com/index.php?page=ts_viewer&ID=1060332) (fritz.campingrider.de) oder unter:
# [Facebook](http://www.tsviewer.com/index.php?page=ts_viewer&ID=1060332) # [Twitter](https://twitter.com/Camping_RIDER) # [Steam](http://steamcommunity.com/id/Camping_RIDER) # [YouTube](https://www.youtube.com/user/RidersFlame) # [Self-Wiki](http://wiki.selfhtml.org/wiki/Benutzer:Camping_RIDER) #
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
Hintergrundmusik pausieren
bearbeitet von
Aloha ;)
> > Und das "abfragen, ob Section zu sehen ist" funktioniert wie genau? Das ist doch gerade mit des Pudels Kern...
>
> In dem er die Koordinaten der Sektion ermittelt und mit dem Bildschirm-Offset vergleicht?
Soweit, so klar. Es wäre allerdings hilfreich gewesen, dazu zu sagen **wie** man das macht (denn genau das war meine Frage).
Ich wusste es jedenfalls nicht auswendig und musste zuerst nachlesen.
Jedenfalls sollte folgende Funktion dabei helfen, die Koordinaten der Sektion mittels JavaScript zu ermitteln:
~~~js
function getPosition(element) {
var xPosition = 0;
var yPosition = 0;
while(element) {
xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
element = element.offsetParent;
}
return { x: xPosition, y: yPosition };
}
~~~
([Quelle](http://www.kirupa.com/html5/get_element_position_using_javascript.htm))
An den TO:
Du kannst das scroll-Event des window abfangen und in der Event-Listener-Funktion die Wiedergabe nur dann pausieren, wenn `getPosition(document.getElementById("section4"))` entsprechende Werte liefern, die zwischen `window.pageXOffset` und `window.pageXOffset + window.innerWidth` liegen bzw. zwischen `window.pageYOffset` und `window.pageYOffset + window.innerHeight`.
Und bitte, bitte, frag mich nicht nach einer JQuery-Lösung - wer JQuery verwenden möchte, sollte dafür JavaScript beherrschen - und dann sollte es ein leichtes sein, den JavaScript-Lösungsweg in JQuery umzusetzen. Oder einfach JavaScript zu benutzen. JQuery ist ein sinnvolles JavaScript-Tool, aber kein Selbstzweck.
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
Erreichbar manchmal im Self-TS (ts.selfhtml.org) oder sonst - wenn online - auf dem [eigenen TeamSpeak-Server](http://www.tsviewer.com/index.php?page=ts_viewer&ID=1060332) (fritz.campingrider.de) oder unter:
# [Facebook](http://www.tsviewer.com/index.php?page=ts_viewer&ID=1060332) # [Twitter](https://twitter.com/Camping_RIDER) # [Steam](http://steamcommunity.com/id/Camping_RIDER) # [YouTube](https://www.youtube.com/user/RidersFlame) # [Self-Wiki](http://wiki.selfhtml.org/wiki/Benutzer:Camping_RIDER) #
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[