Paul: Stream/Musik seitenübergreifend abspielen (ohne Frames oder Popups)

Hallo, ich möchte gerne ein Webradio eröffnen und suche dazu eine Möglichkeit, einen Stream seitenübergreifend abzuspielen. Dazu hätte ich gerne (ähnlich wie bei hr3.de) einen festen Player am unteren Seitenrand.

Das ganze möchte ich am Besten ohne Frames oder Flash realisieren. Man könnte es zwar mit AJAX versuchen, das den Content, sobald ich auf ein Navigationselement klicke, austauscht, dann wird man jedoch nicht auf eine andere Seite weitergeleitet, wodurch sich die URL nicht ändert. (Ich hätte aber gerne, dass sie sich ändert)

Bei HR3 ändert sich der Link obwohl die Musik weiterläuft. Weiß jemand, wie das realisiert wurde, sodass ich dies ebenfalls umsetzen kann?

Paul

akzeptierte Antworten

  1. Hallo Paul,

    HR3 macht das mit JavaScript, sie konvertieren die Klicks auf Links in AJAX und lassen so den Music-Player laufen. Die URL-Anzeige im Browser kann man über die pushState Methode des History-Objekts steuern, dort gibt es auch ein Event beforeunload, mit dem man sogar bei Klick auf "Zurück" noch eingreifen und den harten Rücksprung verhindern kann. Alternativ zu diesem Rummel kannst Du auch mit AJAX und Hash-URLs arbeiten und deine Links nur hinter dem Hash-Zeichen verändern, das löst keinen neuen Seitenabruf aus. Du musst dann allerdings schon auf eine Navigation zu einer bestimmten Hash-URL reagieren (guckst Du hier) und die Seitendarstellung erneuern. Eine Library dafür kann z.B. Sammy sein, weiß nicht ob das noch modern ist.

    Habe selbst sowas noch nicht gebaut, aber das waren meine ersten Ansätze wie sie es gemacht haben könnten.

    Rolf

    --
    sumpsi - posui - clusi
    1. Hallo Rolf,

      danke für deine Antwort. Ich frage jetzt einfach bei dem Betritt der Seite die Hash-URL ab und füge dann die jeweilige Datei per AJAX in den Main/Content Bereich der Webseite ein. Wenn auf ein Element in der Navigation geklickt wird, wird eine neue Hash-URL gesetzt und der Content wird geändert.

      Vielen Dank für die Idee mit den Hash-URLs.

      Paul