(gelöst) HTML DOM scrollTop Property
-
Hallo,
ich generiere meine Einkaufsliste über ein JS-Script. Da beim hinzufügen und entfernen von Elementen jeweils die Tabelle neu generiert werden muss, "vergisst" VIS die Position und beginnt immer wieder mit dem ersten Eintrag. Dem möchte ich nun gerne Abhilfe verschaffen, indem ich beim scrollen die Position merke, diese anschliessend in einen DP schreibe und bei der Neugeneration der Liste wieder zur bereits gespeicherten Scrollposition gehe.
dies sollte eigentlich gem. https://www.w3schools.com/jsref/prop_element_scrolltop.asp auch funktionieren:
Widget-Export:
meine Frage nun: wie kriege ich nun den Pixelwert in den DP? aktuell habe ich da "20" drin. Hat evtl. jemand einen guten Ansatz?
-> der Ansatz von https://forum.iobroker.net/topic/16879/vorlage-tracklisthtml-scrolling-für-spotify -> Skript für Spotify_Playlist -> scrollIntoView habe ich bereits implementiert. Funktioniert auch, leider ist die Ausrichtung etwas ungenau, da die genaue Position des Elementes auf dem Bildschrim so nicht bekannt ist.
-
@ice987
Schau mal hier.
https://www.javascripttutorial.net/dom/css/get-and-set-scroll-position-of-an-element/ -
@OliverIO
Vielen Dank für deine Unterstützung... offenbar reichen da aber meine JS-Kenntnisse nicht. -
@ice987
hast du schon aufgegeben?
benenne doch mal dein konkretes aktuelles Problem an dem es hakt, dann kann ich dir helfen,
oder hast du es gar nicht probiert? -
@OliverIO
mein Problem ist, dass ich nicht weiss, wie ich den vom JS-generierten (Scroll)Wert als HTML verwendbaren Wert erhalte, welchen in dann in den DP speichern kann. Den Ansatz, welchen ich versuche ist wie folgt:https://stackoverflow.com/questions/14845710/javascript-variable-access-in-html
-
ich habe dir dein widget mal etwas um überflüssige anteile bereinigt
und die scrollposition so gesetzt, das man das auch immer sieht.
hast du den das genau verstanden welcher Anteil da was genau macht?
Wenn nicht, dann sollten wir erst einmal damit anfangen.was ich so sehe ist, das die funktion zum speichern der position als datenpunkt erst aufgerufen wird, wenn du auf ein bestimmtes element clickst.
du solltest die funktion zur anzeige der scrollposition so anpassen, das darin der wert in den datenpunkt geschrieben wird. da diese funktion aber uU zig mal pro sekunde vom browser aufgerufen wird, solltest du da eine zeitverzögerte Prüfung einbauen, so das der wert erst geschrieben wird, wenn 500ms oder 1000ms keine änderung der scrollposition erfolgt.
ich habe dir mal in die anzeige noch einen counter eingebaut, so das du siehst wie oft die funktion so aufgerufen wird. -
vielen Dank für deine Unterstützung. Also, ich habe mir deine Aktualisierung angeschaut und lerne folgendes:
- im basic HMTL-Widget brauche ich in kein vollständiges "HTML-Gerüst", d.h. ich kann "<!DOCTYPE html><html><head></head></html>" weglassen
- den Code habe ich (für mich) mal auskommentiert
nun habe ich eine neue "function myFunction2()" definiert (auch neue Variablen). Mit dieser hole ich den scrollTop-Wert und übergebe diese dem onclick-Statement und schreibe diese in den DP.
-
@ice987 sagte in HTML DOM scrollTop Property:
im basic HMTL-Widget brauche ich in kein vollständiges "HTML-Gerüst", d.h. ich kann "<!DOCTYPE html><html><head></head></html>" weglassen
ja genau, du hast ja bereits ein html/head/body-konstrukt, das dir bereits vis bereitstellt. vis fügt dir das widget in die vorhandene seite an entsprechender stelle ein.
ich habe nochmal ein paar änderungen vorgenommen, da das td-test-element in einer tabelle so keine klicks empfangen kann. daher ein separater button, der eine funktion aufruft, wo zum einen der dp gesetzt wird und zum anderen dir direkt anzeigt ob es funktioniert.
bei mir hat es soweit funktioniert.
