Halten Sie ein SVG-Objekt beim Scrollen statisch

In meiner Webanwendung erstelle ich eine SVG-Datei, die einen "Header" enthält, den ich oben im Fenster sichtbar halten möchte, wenn der Benutzer das Bild nach unten scrollt.

Ich kann mir zwei Möglichkeiten vorstellen, um dies zu erreichen, suche aber nach anderen guten Ideen. Meine zwei Gedanken sind:

Generieren Sie zwei separate SVGs, eine als "Überschrift" und eine als Inhalt, und zeigen Sie sie dann einfach in zwei verschiedenen HTML-Formaten an<div> Elemente, so dass die untere einen Bildlauf durchführen kann. Diese Idee gefällt mir nicht, weil ich zwei separate Dokumente erstellen müsste.

Verwenden Sie ECMAScript in der SVG-Datei selbst und finden Sie einen Weg, die<g> Das enthält die Kopfzeile oben auf der Seite. Ich mag das, denn wann immer die SVG angezeigt wird, sollte sie funktionieren, aber ich bin mir nicht sicher, wie ich das erreichen soll, und würde Hinweise oder Beispiele begrüßen.

Antworten auf die Frage(4)

Ihre Antwort auf die Frage