Navigation

Springe zum Hauptinhalt
Universitäts­rechen­zentrum
Einbinden von Videos

Einbinden von Videos

Mit HTML5 können Videos unkompliziert in eine Webseite eingebunden werden. Das Video muss in der Kodierung H.264 (H.264 video codec + AAC audio codec) mit Dateiendung .mp4 vorliegen, um in allen aktuellen Webbrowsern abspielbar zu sein. Die folgenden freien Formate werden leider nicht von allen Webbrowsern abgespielt, können für ältere Browser trotzdem angegeben werden:

  • VP8 oder VP9 video codec + Vorbis audio codec – Dateiendung .webm
  • Theora video codec + Vorbis audio codec – Dateiendung .ogg

So binden Sie das Video ein:

<video controls poster="/tu/film/film.jpg">
  <source src="/tu/film/tu-chemnitz_german.mp4" type="video/mp4">
  <source src="/tu/film/tu-chemnitz_german.webm" type="video/webm">
  Ihr Browser unterstützt das Abspielen dieses Videos nicht.
  <a href="/tu/film/tu-chemnitz_german.mp4">Download MP4-Video</a>
</video>

So sieht es aus:

Weitere Hinweise

  • Soll sofort nach dem Laden der Webseite das Abspielen beginnen, fügen Sie dem video-Tag noch autoplay hinzu.
  • Soll durch Klicken auf das Video das Abspielen beginnen oder angehalten werden, muss etwas JavaScript ergänzt werden – in einer eigenen Datei video.js:
    $(document).ready(function() {
      // Für video mit id="video2" Klick-Aktionen
      $('#video2').click(function(){
        if (typeof InstallTrigger == 'undefined') 
          this.paused this.play() : this.pause();
      });
    });
    Um das einzubinden, muss im Seitenkopf stehen:
    <?php
    require_once('config.inc');
    $javascript[] = 'video.js';
    seite(__FILE__); ?>

Siehe auch:

Presseartikel