video3.html 2.8 KB
Newer Older
Jonas Heinrich's avatar
Jonas Heinrich committed
1 2 3 4 5 6
<html>
  <body>

    <div id="player" class="vid-wrapper videre-container mouse-entered" style="width: 100%;">

      <div class="vid-html5">
Jonas Heinrich's avatar
Jonas Heinrich committed
7
        <video src="video/video3.webm" id="html-player" style="width: 100%;" poster="video/video3.png"></video>
Jonas Heinrich's avatar
Jonas Heinrich committed
8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
      </div>
      <div class="vid-toggle-layer"></div>
      <div class="vid-shadow-layer"></div>
      <div class="vid-controls-bottom flex align-center justify-center">
        <div class="vid-controls-wrapper">
          <div class="vid-controls-contents flex align-center justify-center">
            <button class="vid-play-btn item"><i class="ion-ios-play flex align-center"></i></button>
            <div class="vid-volume-container flex align-center">
              <button class="vid-volume-control item"><i class="ion-android-volume-up flex align-center"></i></button>
              <div id="vol-control" class="vid-volume-slider"></div>
            </div>
            <span class="vid-current-time"></span>
            <div class="vid-progress">
              <div class="progress-bg"></div>
              <div class="progress-loaded"></div>
              <div class="progress-fg"></div>
              <div class="progress-hovertime"></div>
            </div>
            <span class="vid-duration"></span>
            <button class="vid-request-fullscreen item"><i class="ion-android-expand flex align-center"></i></button>
          </div>
        </div>
      </div>
      <div class="vid-bottom-progress-bar">
        <div class="progress-fg"></div>
      </div>

    </div>

    <div class="description">
Jonas Heinrich's avatar
Jonas Heinrich committed
38
      <h2>Sebastian Vrancx - Überfall auf einen Geleitzug (1618)</h2>
Jonas Heinrich's avatar
Jonas Heinrich committed
39 40 41 42 43 44 45 46 47 48
      <p class="prose-big">Bla bla</p>
      Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
      Bla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla blaBla bla bla Bla bla bla Bla bla bla
    </div>
Jonas Heinrich's avatar
Jonas Heinrich committed
49 50 51 52 53 54 55 56

    <div id="video-navigation">
      <div class="btn">
        <a href="#" src="video/video2.html">< Vorheriges Objekt</a>
      </div>
      <div class="btn">
        <a href="#" src="video/video4.html">Nächstes Objekt ></a>
      </div>
Jonas Heinrich's avatar
Jonas Heinrich committed
57 58 59 60 61 62 63
    </div>

  </body>

  <script language="javascript">
    $(document).ready(function(){
    	$('#player').videre();
Jonas Heinrich's avatar
Jonas Heinrich committed
64 65 66 67 68

      $( ".btn " ).click(function() {
        var link = $(this).find('a:first').attr('src');
        load_page(link);
      });
Jonas Heinrich's avatar
Jonas Heinrich committed
69 70 71
    });
  </script>
</html>