Seien Sie nicht schüchtern?
Wie zu verwenden
? Methode 1
Direkter Zugriff: https://iuroc.github.io/haixiu/.
? Methode 2
Forken Sie dieses Projekt und verwenden Sie dann Github Pages, um das Verzeichnis /docs bereitzustellen.
Projektfunktionen
- Rein statische Website, kann direkt über Github Pages bereitgestellt werden
- Unterstützt das Paging und die Anzeige von Daten nach Tags sowie das Scrollen nach unten, um automatisch den nächsten Seiteninhalt hinzuzufügen
- Implementieren Sie einen hochwertigen Bildbetrachter basierend auf PhotoSwipe
- Wenn der Bildbetrachter zwischen Bildern wechselt, scrollt die Miniaturansichtsliste und folgt der angezeigten Seite.
- Wenn der Bildbetrachter das letzte Bild erreicht, wird automatisch die nächste Datenseite hinzugefügt, ohne dass das Browsen unterbrochen wird.
- Basierend auf Location Hash unterstützt die Implementierung History.back() zum Schließen des Bildbetrachters und ist mit der mobilen Zurück-Taste kompatibel.
- Basierend auf Location Hash implementiert, um History.forward() zu unterstützen, um den Bildbetrachter zu öffnen und den letzten Standort automatisch wiederherzustellen
- Beim Schließen des Bildbetrachters über Hash wird das Unterbrechen der Animation unterstützt, was ein tolles Erlebnis ist
- Zeichnen Sie die Position der Bildlaufleiste automatisch auf und beseitigen Sie die Auswirkungen von HashChange-Ereignissen auf die Bildlaufleiste
Verwandte Technologien
- Verwenden des Fetch-API-Crawlers von Node.js
- Nach dem Crawlen der Daten werden die Seiten in mehreren JSON-Dateien gespeichert, wobei Seitenzahlen und Tag-Informationen in den Dateinamen markiert sind.
- Das Frontend verwendet das Van.js-Framework, um eine reaktionsfähige Benutzeroberfläche zu erstellen
- Das Front-End fordert statische JSON-Dateien direkt über Fetch an, um Paging-Anfragen zu implementieren.
- Implementieren Sie den Bildbetrachter mithilfe der PhotoSwipe-Bibliothek
Ressourcenaktualisierungen
Bitte lesen Sie dieses Dokument: README zum Bildsammlungsprogramm
