forked from cal/tdf-2023-webseite
parent
f93d84e305
commit
91239e0944
@ -1,55 +0,0 @@ |
||||
<!DOCTYPE html> |
||||
<html> |
||||
|
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta property="og:image" content="image/poster.png"/> |
||||
<link rel="stylesheet" type="text/css" href="styles-4.7.css"> |
||||
<title>Impressum</title> |
||||
</head> |
||||
|
||||
<body> |
||||
<div id="languages"><a href="en/imprint.html"><img src="image/gb.png"></a></div> |
||||
<div class="background"> |
||||
|
||||
<div id="content"> |
||||
|
||||
<div class="banner-box"> |
||||
<img class="banner" id="banner-1" src="image/banner-1.png" /> |
||||
<img class="banner" id="banner-2" src="image/banner-2.png" /> |
||||
<img class="banner" id="banner-3" src="image/banner-3.3.png" /> |
||||
</div> |
||||
|
||||
<div class="box" id="imprint"> |
||||
<h2>Impressum</h2> |
||||
<p> |
||||
<strong>Anschrift</strong> |
||||
</p> |
||||
<p> |
||||
Chaostreff Tübingen e.V.<br /> |
||||
Bei den Pferdeställen 8<br /> |
||||
72072 Tübingen<br /> |
||||
</p> |
||||
<p> |
||||
Im Web: <a href="https://cttue.de" class="urlextern" target="_blank" title="https://cttue.de" |
||||
rel="ugc nofollow noopener">https://cttue.de</a> |
||||
</p> |
||||
<p> |
||||
<strong>Kontakt</strong> |
||||
</p> |
||||
<p> |
||||
Für allgemeinen Kontakt empfehlen wir eine E-Mail an mail(at)cttue.de |
||||
</p> |
||||
<p> |
||||
Chaostreff Tübingen e.V. ist im Vereinsregister des Amtsgericht Stuttgart unter der Vereinsnummer VR |
||||
726042 eingetragen. |
||||
</p> |
||||
</div> |
||||
|
||||
<p> </p> |
||||
|
||||
</div> |
||||
</div> |
||||
</body> |
||||
|
||||
</html> |
@ -1,221 +0,0 @@ |
||||
<!DOCTYPE html> |
||||
<html> |
||||
|
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta property="og:image" content="image/poster.png" /> |
||||
<link rel="stylesheet" type="text/css" href="styles-4.7.css"> |
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> |
||||
<title>4. Tübinger Tage der digitalen Freiheit</title> |
||||
</head> |
||||
|
||||
<body> |
||||
<div class="background"> |
||||
|
||||
<div id="content"> |
||||
|
||||
<nav class="navigationbar"> |
||||
<div style="display: flex; justify-content: space-between; align-items: center; width: 100%;"> |
||||
<div> |
||||
<a href="index.html" class="nav-button inactive">Hauptseite</a> |
||||
<a href="participate.html" class="nav-button">Mitmachen</a> |
||||
<a href="site-plan.html" class="nav-button">Lageplan</a> |
||||
<a href="https://cfp.cttue.de/tdf4/schedule" class="nav-button">Fahrplan <i class="fas fa-external-link-alt"></i></a> |
||||
<a href="https://elfen.cttue.de/" class="nav-button">Elfensystem <i class="fas fa-external-link-alt"></i></a> |
||||
</div> |
||||
<div> |
||||
<a href="en/index.html" class="nav-button"><img src="image/gb.png" style="height: 16px; vertical-align: middle;"> EN</a> |
||||
</div> |
||||
</div> |
||||
</nav> |
||||
|
||||
<div class="banner-box"> |
||||
<img class="banner" id="banner-1" src="image/banner-1.png" /> |
||||
<img class="banner" id="banner-2" src="image/banner-2.png" /> |
||||
<img class="banner" id="banner-3" src="image/banner-3.3.png" /> |
||||
</div> |
||||
|
||||
<div class="box" id="event"> |
||||
<h2>26./27. Juli 2025</h2> |
||||
<p>Die Tübinger Tage der digitalen Freiheit sind ein offenes Chaos-Community-Event. |
||||
Das Event richtet sich bei weitem nicht nur an Nerds, sondern an alle, die an einem Leben in |
||||
Freiheit und Selbstbestimmung interessiert sind. Dazu möchten wir mit Werkzeugen zur |
||||
Selbstbefähigung in Form von Workshops und Vorträgen anreizen. Man darf aber auch gerne zum Chillen, |
||||
Gespräche und Blinkereien genießen vorbeikommen. |
||||
</p> |
||||
<p class="big">All Creatures Welcome!</p> |
||||
<div class="button-container"> |
||||
<a href="tdf3/recap.html" class="button">Rückblick auf den TDF 2024</a> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="box"> |
||||
<h2>Zeitplan</h2> |
||||
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 2em;"> |
||||
<div> |
||||
<h3>Samstag, 26. Juli 2025</h3> |
||||
<ul> |
||||
<li><b>09:00 Uhr:</b> Einlass für Assembly-Area</li> |
||||
<li><b>11:00 Uhr:</b> Einlass für alle</li> |
||||
<li><b>12:00 Uhr:</b> Einführung Herald und TV-Elfen</li> |
||||
<li><b>13:00:</b> Eröffnung</li> |
||||
<li><b>14:00 – 23:00 Uhr:</b> Programm</li> |
||||
<li><b>23:00 – 9:00 Uhr:</b> Nightshift</li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<h3>Sonntag, 27. Juli 2025</h3> |
||||
<ul> |
||||
<li><b>09:00 Uhr:</b> Einlass und Frühstück</li> |
||||
<li><b>10:00 Uhr:</b> Einführung Herald und TV-Elfen</li> |
||||
<li><b>11:00 – 17:00 Uhr:</b> Programm</li> |
||||
<li><b>ab 17:00 Uhr:</b> Abbau</li> |
||||
</ul> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
|
||||
<div class="box"> |
||||
<h2>Programm</h2> |
||||
<p>Es erwarten euch ca. 50 Vorträge und Workshops in 4 Sälen aus folgenden Themenbereichen:</p> |
||||
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr 1fr;"> |
||||
<div> |
||||
<ul> |
||||
<li>Kreativität & Schönheit</li> |
||||
<li>Ethik, Politik & Gesellschaft</li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<ul> |
||||
<li>Hardware & Code</li> |
||||
<li>Digitalität & Mündigkeit</li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<ul> |
||||
<li>Vielfalt & Achtsamkeit</li> |
||||
<li>Nachhaltigkeit & Klima</li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<ul> |
||||
<li>Science & Technology</li> |
||||
<li>Vernetzung & Aktionen</li> |
||||
</ul> |
||||
</div> |
||||
</div> |
||||
<div class="button-container"> |
||||
<a href="https://cfp.cttue.de/tdf4/schedule" class="button">Fahrplan</a> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="box" id="participate"> |
||||
<h2>macht mit!</h2> |
||||
<p>Der Tag der digitalen Freiheit wird möglich durch deine Mitarbeit. Es gibt viele Möglichkeiten, wie |
||||
du zum Gelingen der Veranstaltung beitragen kannst. Auf der folgenden Seite kannst du mehr darüber |
||||
erfahren:</p> |
||||
<div class="button-container"> |
||||
<a href="https://elfen.cttue.de/" class="button">Elfensystem</a> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="box" id="register"> |
||||
<h2>Anmelden</h2> |
||||
<p>Du kannst dich für die Tübinger Tage der digitalen Freiheit anmelden, um uns bei der Planung zu |
||||
helfen und um auf dem Laufenden zu bleiben. Die Anmeldung ist freiwillig und kostenlos. Du kannst |
||||
aber eine Spende geben, um die Veranstaltung zu unterstützen.</p> |
||||
</p> |
||||
<div class="button-container"> |
||||
<a href="https://pretix.cttue.de/cttue/tdf4" class="button">Anmelden</a> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="box" id="location"> |
||||
<h2>Ort</h2> |
||||
<p>Der Tag der digitalen Freiheit findet in der Westspitze Tübingen statt.</p> |
||||
<p class="big">Eisenbahnstraße 1, 72072 Tübingen</p> |
||||
<p>Das Gebäude ist zu Fuß aus der Innenstadt in ca. 15 Minuten, vom Hauptbahnhof in ca. 10 Minuten, oder |
||||
von den |
||||
Bushaltestellen „Blaue Brücke" und „Landestheater" zu erreichen.</p> |
||||
<p>Wir treffen uns in den Räumen und auf den Flächen des Erdgeschoss und der Etagen 2, 6 und 7.</p> |
||||
<div class="button-container"> |
||||
<a href="site-plan.html" class="button">Lageplan</a> |
||||
</div> |
||||
<iframe id="map" width="800" height="500" |
||||
src="https://www.openstreetmap.org/export/embed.html?bbox=9.061722457408907%2C48.51540328325071%2C9.064798951148989%2C48.517036085911435&layer=mapnik&marker=48.516218802800694%2C9.063262045383453" |
||||
style="border: 1px solid black"></iframe><br /><small><a |
||||
href="https://www.openstreetmap.org/?mlat=48.51622&mlon=9.06326#map=19/48.51622/9.06326">Größere |
||||
Karte |
||||
anzeigen</a> |
||||
</div> |
||||
|
||||
<div class="box" id="ctt"> |
||||
<h2>Veranstalter*innen</h2> |
||||
<p>Der Tübinger Tag der digitalen Freiheit wird vom Chaostreff Tübingen e.V. (CTT) initiiert und |
||||
veranstaltet. Der Chaostreff ist ein gemeinnütziger Verein und steht inhaltlich dem Chaos Computer |
||||
Club e. V. nahe. Die Mitglieder treffen sich regelmäßig zum Austausch und gemeinsamen Arbeiten an |
||||
technischen, digitalen, kulturellen und gesellschaflichen Themen.</p> |
||||
<p>Mehr Informationen und Termine unter <a href="https://cttue.de/">cttue.de</a>.</p> |
||||
</div> |
||||
|
||||
<div class="box" id="sponsor"> |
||||
<h2>Unterstützer*innen</h2> |
||||
<p>Der TDF ist ein nicht-kommerzielles Event und wird von allen Beteiligten ehrenamtlich durchgeführt. |
||||
Dadurch ist das Angebot kostenfrei für die Öffentlichkeit zugänglich.</p> |
||||
<p>Damit dies möglich ist, haben uns in den vergangen Jahren Sponsoren unterstützt. Auch dieses Jahr |
||||
freuen wir uns auf Unterstützer*innen. </p> |
||||
<h3>Unsere Sponsoren</h3> |
||||
<p /> |
||||
<ul class="sponsor-logos"> |
||||
<li> |
||||
<img src="image/logo-coworkgroupde.jpg" alt="Cowork Group Logo" style="height: 80px;"> |
||||
</li> |
||||
<li> |
||||
<img src="image/logo-itdesign.png" alt="itdesign Logo"> |
||||
</li> |
||||
<li> |
||||
<img src="image/logo-active-group.png" alt="Active Group Logo"> |
||||
</li> |
||||
<li> |
||||
<img src="image/logo-daasi.png" alt="DAASI International Logo"> |
||||
</li> |
||||
<li> |
||||
<img src="image/logo-puzzle.png" alt="Puzzle ITC Logo"> |
||||
</li> |
||||
<li> |
||||
<img src="image/logo-syss.png" alt="SySS Logo" style="height: 80px;"> |
||||
</li> |
||||
</ul> |
||||
<p>Möchtest du den TDF finanziell oder auf andere Weise unterstützen oder kennst jemanden, der dafür in |
||||
Frage kommt? Schreib uns unter <a href="mailto:tdf@cttue.de">tdf@cttue.de</a>.</p> |
||||
</div> |
||||
|
||||
<div class="box" id="previous"> |
||||
<h2>Vorherige Events</h2> |
||||
<p>Der Tag der digitalen Freiheit findet seit 2022 jährlich statt. Hier geht es zu den Seiten |
||||
der vorhergenden Events. |
||||
</p> |
||||
<div class="buttons-wrapper"> |
||||
<div class="button-container"> |
||||
<a href="https://tdf.cttue.de/tdf1/" class="button">TDF1 | 2022</a> |
||||
</div> |
||||
<div class="button-container"> |
||||
<a href="https://tdf.cttue.de/tdf2/" class="button">TDF2 | 2023</a> |
||||
</div> |
||||
<div class="button-container"> |
||||
<a href="https://tdf.cttue.de/tdf3/" class="button">TDF3 | 2024</a> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="center"> |
||||
<a href="imprint.html" id="imprint">Impressum</a> |
||||
</div> |
||||
|
||||
</div> |
||||
<p> </p> |
||||
</div> |
||||
</body> |
||||
|
||||
</html> |
@ -1,178 +0,0 @@ |
||||
<!DOCTYPE html> |
||||
<html> |
||||
|
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta property="og:image" content="image/poster.png" /> |
||||
<link rel="stylesheet" type="text/css" href="styles-4.7.css"> |
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> |
||||
<title>4. Tübinger Tage der digitalen Freiheit</title> |
||||
</head> |
||||
|
||||
<body> |
||||
|
||||
<div class="background"> |
||||
|
||||
<div id="content"> |
||||
|
||||
<nav class="navigationbar"> |
||||
<div style="display: flex; justify-content: space-between; align-items: center; width: 100%;"> |
||||
<div> |
||||
<a href="index.html" class="nav-button">Hauptseite</a> |
||||
<a href="participate.html" class="nav-button inactive">Mitmachen</a> |
||||
<a href="site-plan.html" class="nav-button">Lageplan</a> |
||||
<a href="https://cfp.cttue.de/tdf4/schedule" class="nav-button">Fahrplan <i class="fas fa-external-link-alt"></i></a> |
||||
<a href="https://elfen.cttue.de/" class="nav-button">Elfensystem <i class="fas fa-external-link-alt"></i></a> |
||||
</div> |
||||
<div> |
||||
<a href="en/participate.html" class="nav-button"><img src="image/gb.png" style="height: 16px; vertical-align: middle;"> EN</a> |
||||
</div> |
||||
</div> |
||||
</nav> |
||||
|
||||
<div class="banner-box"> |
||||
<img class="banner" id="banner-1" src="image/banner-1.png" /> |
||||
<img class="banner" id="banner-2" src="image/banner-2.png" /> |
||||
<img class="banner" id="banner-3" src="image/banner-3.3.png" /> |
||||
</div> |
||||
|
||||
<div class="box"> |
||||
<h2>Das Event</h2> |
||||
<p>Der Tag der digitalen Freiheit ist ein Event organisiert aus der Chaos-Community und findet zum |
||||
vierten Mal |
||||
in Folge in Tübingen statt.</p> |
||||
<p>Auf dem Event treffen sich Freaks, Künstlerinnen, Utopistinnen und einfach nur wissensgierige |
||||
Menschen um |
||||
gemeinsam voneinander und miteinander zu lernen. Uns alle verbindet der offene Austausch über |
||||
Kreativität, |
||||
Schönheit, unsere Gesellschaft, Technik und deren Auswirkung auf uns und die in großen Schritten |
||||
voranschreitende Klimakatastrophe. </p> |
||||
<p>Der Chaostreff Tübingen ist noch relativ jung und am Aufbau und Pflegen einer Community. Deren |
||||
geteilte Werte |
||||
sind es gemeinschaftlich und unkommerziell einen Raum zu schaffen, in dem man voneinander lernen, |
||||
sich |
||||
entfalten und organisieren kann. Dieser soll auch ein Forum zum Austausch nahestehnder Gruppierungen |
||||
und |
||||
Individuen dienen.</p> |
||||
<p>Der Tag der digitalen Freiheit ist dazu da diese Utopie zu verwirklichen. Wenn du unsere Werte und <a |
||||
href="https://www.ccc.de/hackerethik">Ethik</a> teilst und mithelfen willst, bist du herzlich |
||||
dazu |
||||
eingeladen.</p> |
||||
</div> |
||||
|
||||
<div class="box"> |
||||
<h2>Termine</h2> |
||||
|
||||
<h3>Vorbereitung</h3> |
||||
<ul> |
||||
|
||||
<li>Regelmäßige Meetings des Orga-Teams (meist Donnerstags). Mehr Infos dazu unter <a |
||||
href="mailto:tdf@cttue.de">tdf@cttue.de</a></li> |
||||
<li>Sonntag 30. März 2025 15:00 Uhr - „Kickoff Event“ – Treffen für alle, die sich beteiligen |
||||
möchten.</li> |
||||
</ul> |
||||
|
||||
<h3>Event</h3> |
||||
<ul> |
||||
|
||||
<li>Freitag 25. Juli 2025 - ab 12:00 Uhr Aufbau </li> |
||||
<li>Samstag 26. Juli 2025 - TDF Tag 1</li> |
||||
<li>Sonntag 27. Juli 2025 - TDF Tag 2, ab 17:00 Uhr Abbau. </li> |
||||
</ul> |
||||
</div> |
||||
|
||||
<div class="box"> |
||||
<h2>Vorträge & Workshops</h2> |
||||
<p>Der Call for Participation ist geschlossen. Wenn du noch einen wichtigen Beitrag einreichen möchtest, |
||||
kannst |
||||
kannst du eine E-Mail an <a href="mailto:tdf@cttue.de">tdf@cttue.de</a> schreiben. |
||||
</p> |
||||
|
||||
|
||||
</div> |
||||
|
||||
<div class="box" id="assemblies"> |
||||
<h2>Assemblies</h2> |
||||
<p>Komm mit deiner Gruppe, deinem Verein oder bringe dein Projekt mit und erlebe den einzigartigen |
||||
Charme, der entsteht, wenn Menschen gemeinsam an Projekten arbeiten! Wer bereits CCC Events besucht |
||||
hat, weiß genau, wovon die Rede ist. Wir stellen freie und passende Flächen zur Verfügung, damit ihr |
||||
euer Assembly vor Ort umsetzen könnt. </p> |
||||
<p>Was ist ein Assembly? Der Begriff hat viele Bedeutung wie „Konstuktion“, aber auch „Versammlung“. Es |
||||
kann ein |
||||
übergroßes interaktives Kunstobjekt sein, oder eine kreative Erfindung die in die Hosentasche passt. |
||||
Es kann |
||||
aber auch ein Gruppe vor Leuten sein, die sich vor Ort treffen und ihrer Leidenschaft nach gehen. |
||||
</p> |
||||
<p>Wenn du eine Assembly organisieren möchtest, kontaktiere uns bitte unter <a |
||||
href="mailto:assemblies@cttue.de">assemblies@cttue.de</a>.</p> |
||||
</div> |
||||
|
||||
<div class="box"> |
||||
<h2>Elfen</h2> |
||||
<p>Neben den Inhalten lebt das Event auch von der Hilfe netter und hilfreicher Elfen.</p> |
||||
<p>Es werden hinter und auch vor den Kulissen einige helfende Hände benötigt. </p> |
||||
<p>Die Aufgaben sind in 2 Stunden Schichten unterteilt und für alle Helfenden gibts im Elfenhain |
||||
umsonst Mineralwasser und Snacks.</p> |
||||
<p>Das Elfensystem ist unter <a href="https://elfen.cttue.de">elfen.cttue.de</a> zu finden. |
||||
Dort kannst du dich als Elfe registrieren und dich für die Schichten eintragen. |
||||
</p> |
||||
|
||||
|
||||
<p>Bei folgenden Aufgaben kann man niederschwellig dem Orga-Team helfen:</p> |
||||
|
||||
<div style="display: grid; grid-template-columns: 1fr 1fr;"> |
||||
<div> |
||||
<h3>Aufbau</h3> |
||||
<ul> |
||||
<li>Fahrdienste</li> |
||||
<li>Deko</li> |
||||
<li>Möbelierung</li> |
||||
<li>Beschilderung</li> |
||||
</ul> |
||||
<h3>Vorträge</h3> |
||||
<ul> |
||||
<li>„Herald“ / Moderation</li> |
||||
<li>Kamera und Ton</li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<h3>Verpflegung</h3> |
||||
<ul> |
||||
<li>Getränkeverkauf (abends Tschunk etc.)</li> |
||||
<li>WOC (Waffel Operation Center)</li> |
||||
<li>Frühstück</li> |
||||
<li>Elfenverpflegung</li> |
||||
</ul> |
||||
<h3>Abbau</h3> |
||||
<ul> |
||||
<li>Fahrdienst</li> |
||||
<li>Möbelierung</li> |
||||
<li>Putzen</li> |
||||
</ul> |
||||
</div> |
||||
</div> |
||||
|
||||
|
||||
|
||||
</div> |
||||
<div class="box"> |
||||
<h2>Übernachtung</h2> |
||||
<p>Für extern Angereiste wollen wir die Möglichkeit anbieten Freitag und Samstag Nacht zu |
||||
übernachten auf Feldbetten & Sofas. Hierzu bitte unbedingt vorher bei <a |
||||
href="mailto:tdf@cttue.de">tdf@cttue.de</a> anmelden.</p> |
||||
|
||||
</div> |
||||
|
||||
|
||||
|
||||
<div class="center"> |
||||
<a href="imprint.html" id="imprint">Impressum</a> |
||||
</div> |
||||
|
||||
<p> </p> |
||||
|
||||
</div> |
||||
|
||||
</body> |
||||
|
||||
</html> |
@ -1,154 +0,0 @@ |
||||
<!DOCTYPE html> |
||||
<html> |
||||
|
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta property="og:image" content="image/poster.png" /> |
||||
<link rel="stylesheet" type="text/css" href="styles-4.7.css"> |
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> |
||||
<title>4. Tübinger Tage der digitalen Freiheit - Lageplan</title> |
||||
</head> |
||||
|
||||
<body> |
||||
<div class="background"> |
||||
|
||||
<div id="content"> |
||||
|
||||
<nav class="navigationbar"> |
||||
<div style="display: flex; justify-content: space-between; align-items: center; width: 100%;"> |
||||
<div> |
||||
<a href="index.html" class="nav-button">Hauptseite</a> |
||||
<a href="participate.html" class="nav-button">Mitmachen</a> |
||||
<a href="site-plan.html" class="nav-button inactive">Lageplan</a> |
||||
<a href="https://cfp.cttue.de/tdf4/schedule" class="nav-button">Fahrplan <i class="fas fa-external-link-alt"></i></a> |
||||
<a href="https://elfen.cttue.de/" class="nav-button">Elfensystem <i class="fas fa-external-link-alt"></i></a> |
||||
</div> |
||||
<div> |
||||
<a href="en/site-plan.html" class="nav-button"><img src="image/gb.png" style="height: 16px; vertical-align: middle;"> EN</a> |
||||
</div> |
||||
</div> |
||||
</nav> |
||||
|
||||
<div class="banner-box"> |
||||
<img class="banner" id="banner-1" src="image/banner-1.png" /> |
||||
<img class="banner" id="banner-2" src="image/banner-2.png" /> |
||||
<img class="banner" id="banner-3" src="image/banner-3.3.png" /> |
||||
</div> |
||||
|
||||
<div class="box" id="site-plan-intro"> |
||||
<h2>Wo ist was?</h2> |
||||
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1em;"> |
||||
<div> |
||||
<ul> |
||||
<li><a href="#floor-2" class="location-link" data-target="back-office">Back Office</a></li> |
||||
<li><a href="#floor-eg" class="location-link" data-target="bar-foyer">Bar im Foyer</a></li> |
||||
<li><a href="#floor-eg" class="location-link" data-target="buehne-1">Bühne 1</a></li> |
||||
<li><a href="#floor-6" class="location-link" data-target="buehne-2">Bühne 2</a></li> |
||||
<li><a href="#floor-6" class="location-link" data-target="cafeteria">Cafeteria</a></li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<ul> |
||||
<li><a href="#floor-eg" class="location-link" data-target="elfenhain">Elfenhain</a></li> |
||||
<li><a href="#floor-eg" class="location-link" data-target="foyer">Foyer</a></li> |
||||
<li><a href="#floor-eg" class="location-link" data-target="hackspace">Hackspace</a></li> |
||||
<li><a href="#floor-eg" class="location-link" data-target="infodesk">Infodesk</a></li> |
||||
<li><a href="#floor-6" class="location-link" data-target="kaffee">Kaffee</a></li> |
||||
<li><a href="#floor-eg" class="location-link" data-target="kasse">Kasse</a></li> |
||||
</ul> |
||||
</div> |
||||
<div> |
||||
<ul> |
||||
<li><a href="#floor-6" class="location-link" data-target="projekte">Projekte</a></li> |
||||
<li><a href="#floor-2" class="location-link" data-target="silent-room">Silent Room</a></li> |
||||
<li><a href="#floor-7" class="location-link" data-target="skybar">SKYBAR</a></li> |
||||
<li><a href="#floor-6" class="location-link" data-target="waffeln">Waffeln</a></li> |
||||
<li><a href="#floor-2" class="location-link" data-target="workshop-1">Workshop 1</a></li> |
||||
<li><a href="#floor-2" class="location-link" data-target="workshop-2">Workshop 2</a></li> |
||||
</ul> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="box floor-plan" id="floor-eg"> |
||||
<img src="image/Etagen_EG.png" alt="Grundriss Erdgeschoss" class="floor-plan-image" /> |
||||
<div class="location-marker" data-location="bar-foyer" style="top: 40%; left: 36%;"></div> |
||||
<div class="location-marker" data-location="buehne-1" style="top: 36%; left: 85%;"></div> |
||||
<div class="location-marker" data-location="elfenhain" style="top: 60%; left: 93%;"></div> |
||||
<div class="location-marker" data-location="foyer" style="top: 28%; left: 36%;"></div> |
||||
<div class="location-marker" data-location="hackspace" style="top: 36%; left: 60%;"></div> |
||||
<div class="location-marker" data-location="infodesk" style="top: 20%; left: 29%;"></div> |
||||
<div class="location-marker" data-location="kasse" style="top: 40%; left: 36%;"></div> |
||||
</div> |
||||
|
||||
<div class="box floor-plan" id="floor-2"> |
||||
<img src="image/Etagen_2. OG.png" alt="Grundriss 2. Obergeschoss" class="floor-plan-image" /> |
||||
<div class="location-marker" data-location="back-office" style="top: 13%; left: 70%;"></div> |
||||
<div class="location-marker" data-location="silent-room" style="top: 13%; left: 57%;"></div> |
||||
<div class="location-marker" data-location="workshop-1" style="top: 54%; left: 38%;"></div> |
||||
<div class="location-marker" data-location="workshop-2" style="top: 13%; left: 83%;"></div> |
||||
</div> |
||||
|
||||
<div class="box floor-plan" id="floor-6"> |
||||
<img src="image/Etagen_6. OG.png" alt="Grundriss 6. Obergeschoss" class="floor-plan-image" /> |
||||
<div class="location-marker" data-location="projekte" style="top: 75%; left: 64%;"></div> |
||||
<div class="location-marker" data-location="buehne-2" style="top: 41%; left: 20%;"></div> |
||||
<div class="location-marker" data-location="cafeteria" style="top: 58%; left: 82%;"></div> |
||||
<div class="location-marker" data-location="kaffee" style="top: 58%; left: 82%;"></div> |
||||
<div class="location-marker" data-location="waffeln" style="top: 58%; left: 82%;"></div> |
||||
</div> |
||||
|
||||
<div class="box floor-plan" id="floor-7"> |
||||
<img src="image/Etagen_7. OG.png" alt="Grundriss 7. Obergeschoss" class="floor-plan-image" /> |
||||
<div class="location-marker" data-location="skybar" style="top: 35%; left: 36%;"></div> |
||||
</div> |
||||
|
||||
<div class="center"> |
||||
<a href="imprint.html" id="imprint">Impressum</a> |
||||
</div> |
||||
|
||||
<p> </p> |
||||
|
||||
</div> |
||||
</div> |
||||
|
||||
<script> |
||||
document.addEventListener('DOMContentLoaded', function() { |
||||
const locationLinks = document.querySelectorAll('.location-link'); |
||||
const markers = document.querySelectorAll('.location-marker'); |
||||
|
||||
locationLinks.forEach(link => { |
||||
link.addEventListener('click', function(e) { |
||||
e.preventDefault(); |
||||
|
||||
// Alle Marker ausblenden |
||||
markers.forEach(marker => { |
||||
marker.classList.remove('active'); |
||||
}); |
||||
|
||||
// Ziel-Location finden und Marker anzeigen |
||||
const targetLocation = this.getAttribute('data-target'); |
||||
const targetMarker = document.querySelector(`[data-location="${targetLocation}"]`); |
||||
|
||||
if (targetMarker) { |
||||
targetMarker.classList.add('active'); |
||||
|
||||
// Zur entsprechenden Etage scrollen |
||||
const targetFloor = this.getAttribute('href'); |
||||
const targetElement = document.querySelector(targetFloor); |
||||
if (targetElement) { |
||||
targetElement.scrollIntoView({ behavior: 'smooth' }); |
||||
} |
||||
|
||||
// Marker nach 10 Sekunden ausblenden |
||||
setTimeout(() => { |
||||
targetMarker.classList.remove('active'); |
||||
}, 10000); |
||||
} |
||||
}); |
||||
}); |
||||
}); |
||||
</script> |
||||
</body> |
||||
|
||||
</html> |
Loading…
Reference in new issue