overview.html 4.96 KB
Newer Older
Jonas Heinrich's avatar
Jonas Heinrich committed
1
 <html>
2 3
  <body>
    <div class="description">
Jonas Heinrich's avatar
Jonas Heinrich committed
4 5 6
      <h2>Werkübersicht</h2>
      Unsere Virtuelle-Ausstellung beginnt mit velit magni aliquid minus. Repellendus et harum consectetur alias ad. Suscipit vel assumenda quia similique et quia doloribus. Maiores sed animi voluptate et perferendis eum quia. Et est veniam temporibus quia ipsa repudiandae autem quo. Sed harum assumenda accusantium mollitia.
    </div>
7

Jonas Heinrich's avatar
Jonas Heinrich committed
8 9
    <section class="video-grid">
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
10 11 12 13 14
        <div class="video-img" style="background-image: url('video/video1.jpg');"></div>
        <a href='#' src='video/video1.html'>
          <span class="video-title">Ehrung des Quadrats: Gelbes Zentrum</span>
          <p class="video-description">ein Werk von von Josef Albers (1954), Orangerie. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
15 16
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
17 18 19 20 21
        <div class="video-img" style="background-image: url('video/video2.jpg');"></div>
        <a href='#' src='video/video2.html'>
          <span class="video-title">Dynamische Struktur</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
22 23
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
24 25 26 27 28
        <div class="video-img" style="background-image: url('video/video3.jpg');"></div>
        <a href='#' src='video/video3.html'>
          <span class="video-title">Überfall auf einen Geleitzug</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
29 30
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
31 32 33 34 35
        <div class="video-img" style="background-image: url('video/video4.jpg');"></div>
        <a href='#' src='video/video4.html'>
          <span class="video-title">Abendessen in der Scheune</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
36 37
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
38 39 40 41 42
        <div class="video-img" style="background-image: url('video/video5.jpg');"></div>
        <a href='#' src='video/video5.html'>
          <span class="video-title"> Take a long break I, II</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
43 44
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
45 46 47 48 49
        <div class="video-img" style="background-image: url('video/video6.jpg');"></div>
        <a href='#' src='video/video6.html'>
          <span class="video-title">Großes Stillleben mit Kerzen und Spiegel</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
50 51
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
52 53 54 55 56
        <div class="video-img" style="background-image: url('video/video7.jpg');"></div>
        <a href='#' src='video/video7.html'>
          <span class="video-title">Van Gogh als verkannter Hochstapler</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
57
      </div>
Jonas Heinrich's avatar
Jonas Heinrich committed
58
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
59 60 61 62 63
        <div class="video-img" style="background-image: url('video/video8.jpg');"></div>
        <a href='#' src='video/video8.html'>
          <span class="video-title">Die heilige Elisabeth von Thüringen</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
64 65
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
66 67 68 69 70
        <div class="video-img" style="background-image: url('video/video9.jpg');"></div>
        <a href='#' src='video/video9.html'>
          <span class="video-title">Markgraf Christoph I. von Baden mit seiner Familie</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
71 72
      </div>
      <div class="video-item">
Jonas Heinrich's avatar
Jonas Heinrich committed
73 74 75 76 77
        <div class="video-img" style="background-image: url('video/video10.jpg');"></div>
        <a href='#' src='video/video10.html'>
          <span class="video-title">Bubbles</span>
          <p class="video-description">Molestiae odio amet iste recusandae voluptate officia magni. Sed totam fugit repellat rerum. Consectetur veritatis dolor eveniet.</span>
        </a>
Jonas Heinrich's avatar
Jonas Heinrich committed
78
      </div>
Jonas Heinrich's avatar
Jonas Heinrich committed
79
    </section>
80 81

    <script src="js/main.js"></script>
Jonas Heinrich's avatar
Jonas Heinrich committed
82 83 84 85 86 87
    <script language="javascript">
      $( ".video-item" ).click(function() {
        var link = $(this).find('a:first').attr('src');
        load_page(link);
      });
    </script>
88 89
  </body>
</html>