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>