So vielleicht möchte jemand ja auch sowas haben:
javacript Datei ablegen: files/xxxx/script_leser.js
Backend/Einstellungen/Sicherheit und Script erlauben Wert SRC auch Freigeben.
z.B. HTML Modul Anlegen.
Javascript:
HTML-Code:
document.addEventListener("DOMContentLoaded", function () {
// Elemente aus dem HTML holen
const textContainer = document.getElementById("text-container");
const saveButton = document.getElementById("save-button");
const saveStatus = document.getElementById("save-status");
// Text, den der Benutzer lesen kann (Hier als Beispieltext)
const textToRead = `
Dies ist ein Beispieltext.
Er kann beliebig lang sein, und der Benutzer soll die Möglichkeit haben,
die Position im Text zu speichern und später von dort aus weiterzulesen.`;
// Die gespeicherte Position im Local Storage abrufen (falls vorhanden)
const savedPosition = localStorage.getItem("textPosition");
// Funktion, um den Text an einer bestimmten Position anzuzeigen
function displayText(position) {
textContainer.innerHTML = textToRead.slice(position);
}
// Wenn eine gespeicherte Position vorhanden ist, Text von dieser Position anzeigen
if (savedPosition) {
// Text von der gespeicherten Position anzeigen
displayText(savedPosition);
// Scroll-Position setzen
textContainer.scrollTop = savedPosition;
} else {
// Andernfalls den gesamten Text anzeigen
textContainer.innerHTML = textToRead;
}
// Event-Handler für das Speichern der Position
saveButton.addEventListener("click", function () {
// Aktuelle Scroll-Position im Text speichern
localStorage.setItem("textPosition", textContainer.scrollTop);
// Feedback-Meldung anzeigen
saveStatus.textContent = "Position gespeichert!";
saveStatus.style.display = "block";
// Meldung nach ein paar Sekunden ausblenden
setTimeout(function () {
saveStatus.style.display = "none";
}, 3000); // Hier die Anzeigedauer in Millisekunden anpassen
});
});
2 x Modul HTML ( Einmal Button Einmal Leser )
HTML-Code:
<div id="text-container" class="text-container1">
<!-- Hier wird der Fließtext angezeigt -->
</div>
HTML-Code:
<button id="save-button">Position speichern</button>
<div id="save-status" style="display: none;"></div>
<script src="files/xxx/script_leser.js"></script>
CSS
HTML-Code:
.text-container1 {
width: 600px; /* Breite des Containers, nach Bedarf ändern */
height: 800px; /* Feste Höhe der Scrollleiste */
overflow-y: scroll; /* Vertikale Scrollleiste aktivieren */
border: 1px solid #000; /* Optional: Rand für den Container hinzufügen */
margin-top: 40px; /* Platz oben hinzufügen */
}
.text-container1 p {
padding: 10px; /* Optional: Innenabstand für den Text festlegen */
}
So vielleicht konnte ich ja auch mal jemanden helfen.
Und nochmals dank an die beiden für die Super Unterstützung.
FRAGE: wenn ich es im Modul Speichere brauch ich dann die Sicherheitseinstellung auch ?