Felix23: Unterseiten als Slideshow, aber mit Urls, wie funktioniert das?

SELF-Forum

Unterseiten als Slideshow, aber mit Urls, wie funktioniert das?

Felix23
– Informationen zu den Bewertungsregeln

Guten Morgen,

ich beschäftige mich gerade mit dieser Seite, weil ich die Funktionsweise ziemlich interessant finde: http://www.epic-companies.com/. Leider komme ich nicht dahinter, wie das Ganze funktioniert, und würde gerne mehr über die grundlegende Technik erfahren.

Man kann die fünf Hauptseiten wie in einer Slideshow durchklicken, wobei sich jedoch auch die URL in der Adressleiste ändert. Auch das direkte Eingeben von Unterseiten funktioniert. Es scheint so, als ob in jeder Datei alle Inhalte drin stehen und dann per JS zum jeweiligen Abschnitt gescrollt wird, aber wie genau funktioniert das?

Gibt es ein Framework, was ähnliches bereitstellt? Und wie nennt man diese Technik überhaupt?

Ich wäre dankbar für ein paar Infos.

Viele Grüße,
Felix

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Unterseiten als Slideshow, aber mit Urls, wie funktioniert das?

    Matthias Apsel Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Om nah hoo pez nyeetz, Felix23!

    Ich halte das für keine gute Idee. Es sind alle "Seiten" in der einen Seite vorhanden, die per CSS animiert werden. Es wird also alles geladen, auch was nicht benötigt wird.

    <div class="pages" style="width: 7680px; transform: translate(-5120px, 0px);">

    In diesem div stecken die einzelnen Seiten.

    Das Funktionieren der URL wird wohl mit einem mod-rewrite erledigt

    example.com/foo --> example.com/index.html#foo

    Das Umschreiben in der Addressleiste kann man auch machen https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history?redirectlocale=en-US&redirectslug=Web%2FGuide%2FDOM%2FManipulating_the_browser_history

    Das nervt oft, wenn der zurück-Button nicht wirklich zurückführt.

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Rind und Rindenmulch.

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Unterseiten als Slideshow, aber mit Urls, wie funktioniert das?

      molily Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Das Umschreiben in der Addressleiste kann man auch machen https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

      Das nervt oft, wenn der zurück-Button nicht wirklich zurückführt.

      Wenn man mit pushState URLs in die History einfügt, sollte man natürlich auch auf popstate hören, um bei der Vor- und Zurücknavigation den Status wieder herzustellen, der zu der aktuellen URL passt.

      Eine umfangreichere Implementierung ist History.js. Backbone.History funktioniert ähnlich.

      Grüße,
      Mathias

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

    2. Unterseiten als Slideshow, aber mit Urls, wie funktioniert das?

      Gunnar Bittersmann Homepage des Autors
      – Informationen zu den Bewertungsregeln

      @@Matthias Apsel:

      nuqneH

      Das nervt oft, wenn der zurück-Button nicht wirklich zurückführt.

      Ja, so auch hier. Bei der „Desktop-Version“ funktioniert er. Mit einem Smartphone wird man jedoch auf die „Mobile-Version“ umgelenkt; da funktioniert er nicht.

      Ohne jetzt wirklich Daten zu haben, würde ich doch mal kühn behaupten, dass der Zurück-Button auf Smartphones (zumindest auf denen, wo es einen solchen außerhalb des Displays gibt) noch häufiger benutzt wird als auf Desktop-PCs.

      Warum machen die das überhaupt mit der Umleitung? Breaking the Web. :-( Dabei geben sie sich doch alle Mühe mit dem responsiven Layout.

      Und warum stellen sie sich als des Englischn Unkundige bloß? „Imprint“!! Nein danke.

      Qapla'

      --
      „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln