Tolle Typo3-Website aber wie gemacht ...?

  • MUSIKMANN MUSIKMANN
    R2-D2
    0 x
    85 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2012, 14:29

    Hallo Typoler ;o),

    ich habe eine in meinen Augen sehr toll gemachte Typo3-Webseite im Netz gefunden.

    http://www.move-elevator.de/

    Hier wird im Grunde "scheinbar" nur eine Webseite angezeigt, die immer hoch und runter scrollt, sobald mal einen Link in der Navi anklickt. Leider habe ich im Quelttext keinen Hinweis auf die benutze Extension gefunden und frage deshalb hier nach Hilfe.

    Wie haben die Desiger das so nett umgesetzt? Welche Erweiterung steckt dahinter?

    Vielen Dank für Eure Hilfe ;o).


  • 1
  • jousch jousch
    Jedi-Meister
    0 x
    320 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2012, 15:19

    Dahinter steckt Javascript^^

  • skydivematy skydivema...
    Jedi-Meister
    0 x
    276 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2012, 15:59

    Hallo Musikmann,
    diese Webseite besteht aus nur EINER Seite. Alle Einzelenen Page Elemente werden mit Jquery angesteuert. z.B. Jquery Waypoints ( http://imakewebthings.com/jquery-waypoints/ ). Der Rest ist gutes Webdesign und Harmonierende Farbwahl.
    Wenn Du das mit Templavoila umsetzen willst, dann baust Du ein HTML Konstruckt mit den Einzelnen Bereichen, wie es in Deinem Bespiel zu Sehen ist. z.B. Blauer Bereich (Home) Roter Breich (Über Uns) Grüner Breich (Kontackt) Gelber Bereich (Footer) Das ganze mit Templavoila Mappen. Und schon hast Du alles auf Einer Seite. Fehlt dann noch Die Jquery Anweisung für die Links zum an Scrollen des jeweiligen Breichs.
    Eigentlich sehr einfach zu machen.
    gruss
    maty

  • MUSIKMANN MUSIKMANN
    R2-D2
    0 x
    85 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2012, 19:06

    [quote="skydivematy"]

    Wenn Du das mit Templavoila umsetzen willst, dann baust Du ein HTML Konstruckt mit den Einzelnen Bereichen, wie es in Deinem Bespiel zu Sehen ist. z.B. Blauer Bereich (Home) Roter Breich (Über Uns) Grüner Breich (Kontackt) Gelber Bereich (Footer) Das ganze mit Templavoila Mappen. Und schon hast Du alles auf Einer Seite. Fehlt dann noch Die Jquery Anweisung für die Links zum an Scrollen des jeweiligen Breichs.
    Eigentlich sehr einfach zu machen.
    gruss
    maty
    [/quote]

    Moin Maty,

    ich habe bisher keine Erfahrungen mit TV. Besteht die Möglichkeit, dass du mir dort unter die Arme greifen könntest?

  • jousch jousch
    Jedi-Meister
    0 x
    320 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2012, 19:07

    Ähm, es ist auch ohne TemplaVoila möglich. Ist nicht zwingend notwendig. Mithilfe von beLayout usw ist dies leicht möglich.

  • skydivematy skydivema...
    Jedi-Meister
    0 x
    276 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2012, 22:49

    Das ist natürlich Richtig Jousch.

    Zu Musikmann, wie Du Dein HTML Template Aufbaust ist eigentlich Eagl. Ob TV, Automaketemplate, FLUID oder ganz Händisch mit Typoscript. Die Hauptaufgabe der Navigation innerhalb der Seite Übernimmt sowieso Jquery.

    Schau mal hier habe ich ein kleines Beispiel für Dich: http://tympanus.net/Tutorials/WebsiteScrolling/index_vertical.html

    gruss
    maty

    Hier noch was zum Studieren :-) http://demos.flesler.com/jquery/scrollTo/

  • MUSIKMANN MUSIKMANN
    R2-D2
    0 x
    85 Beiträge
    0 Hilfreiche Beiträge
    26. 03. 2012, 08:34

    Kurze Verständnisfrage.

    Ich kann also ein ganz normales Typo3 verwenden, Seiten anlegen usw.? Klingt ja nicht ungewohnt ...

    Dann die Naiv entsprechend mit jquery-Links versehen und schon wird mir alles untereinander dargestellt?

  • jousch jousch
    Jedi-Meister
    0 x
    320 Beiträge
    0 Hilfreiche Beiträge
    26. 03. 2012, 08:58

    Nein. Sieh dir einfach den Quellcode genau an deines Links. Du findest eine Seite mit den Inhalten, die halt wie mehrere Seiten aussehen. Is wird dan nur per Javascript hingescrolled.

  • MUSIKMANN MUSIKMANN
    R2-D2
    0 x
    85 Beiträge
    0 Hilfreiche Beiträge
    26. 03. 2012, 13:21

    Hallo Jousch,

    sei mir bitte nicht böse, ich stehe vollkommen auf dem "Schlauch".

    Der Quelltext der Seite zeigt mir, dass es sich in meinem Beispiel (erster Beitrag) um eine Typo3 Webseite handelt?!? Nun bin ich meinem jugendlichen Leichtsinn davon ausgegangen, dass man im Typo3 BE so arbeiten kann wie immer, also plugins laden etc. und so auch die Inhalte des FrontEnd dort wie gewohnt erstellen, einpflegen kann.

    Ist dem so oder verstehe ich die ganze Sache falsch?

    Sollte es so sein, dann stellt sich mir gleich die nächste Frage, und zwar, wie mache ich aus einer normalen Typo3 Webseite (wie zum Beispiel http://www.040DJ.com) deren Inhalt ich normal erstellt habe und auch die gewohnten plugins verwende eine solche "Endloswebseite"?

  • king.darki king.dark...
    Sternenflotten-Admiral
    0 x
    219 Beiträge
    0 Hilfreiche Beiträge
    26. 03. 2012, 14:51

    Hallo Gunnar,

    Ich weiß zwar auch nicht, ob da eine Extension dahinter steckt, aber im Grunde musst du einfach nur all deine Inhaltsseiten untereinander auf NUR 1 Seite platzieren.

    Wenn du dir den Quellcode ansiehst, siehst du, dass die Hauptnavigation auf einzelne Div-Anker in der Seite zielt, z. B.:

    1. <div id="me-classic" class="divider"></div>

    Auf die musst du dann auch in deiner Navigation verweisen, dazu noch etwas jQuery um das Scrollen "smooth" zu machen, und du bist fertig!

    Die Anker kannst du z. B. als einfache HTML-Inhaltselement in deine Seite einfügen... Oder die geilere Lösung wäre, du baust mit TS einen Wrap, der vor jedes Inhaltselement einen Div mit dessen Titel als ID erstellt.

    Grüße Patrick

  • 1