From ae6cbd9bc6273a7f14d66043084154e37b0380bc Mon Sep 17 00:00:00 2001 From: anielsen99 Date: Thu, 12 Mar 2026 11:28:30 +0100 Subject: [PATCH] add javascript --- amanda-nielsen.html | 59 ++++++++++++++++++++++++++++++++++++--------- styles.css | 42 ++++++++++++++++++++++++++++++++ 2 files changed, 89 insertions(+), 12 deletions(-) diff --git a/amanda-nielsen.html b/amanda-nielsen.html index 6b234f1..c4c308e 100644 --- a/amanda-nielsen.html +++ b/amanda-nielsen.html @@ -3,21 +3,56 @@ - Document + Graubündner Steinböcke -

Das ist eine Webseite

-
-

Über Graubünden

-

Graubünden ist der größte und östlichste Kanton der Schweiz, bekannt für seine beeindruckende Alpenlandschaft, vielfältige Kultur und drei Amtssprachen: Deutsch, Rätoromanisch und Italienisch.

-

Die Region bietet zahlreiche Aktivitäten wie Wandern, Skifahren und kulturelle Veranstaltungen. Städte wie Chur, die älteste Stadt der Schweiz, sowie malerische Bergdörfer wie St. Moritz und Davos laden Besucher ein.

-

Graubünden ist auch Heimat des UNESCO-geschützten Nationalparks und vieler historischer Sehenswürdigkeiten, die die reiche Geschichte und Tradition des Kantons widerspiegeln.

-
- Berglandschaft in Graubünden -
Typische Alpenlandschaft in Graubünden
-
- +

Graubündner Steinböcke

+ +
+

Willkommen

+

Der Graubündner Steinbock ist ein Symbol der Alpen und hat sich perfekt an das raue Gebirgsklima angepasst. Mit seinem beeindruckenden Geweih und der robusten Statur klettert er elegant über steile Felsen.

+ + + +
+

Interessante Fakten

+ +
+
    +
  • Steinböcke können bis zu 3.50 Meter hoch springen.
    • +
  • Sie erreichen ein Alter von etwa 15–20 Jahren in freier Wildbahn.
    • +
  • Ihre Hufe sind speziell geformt, um auf Eis und Fels Halt zu finden.
    • +
  • Jedes Jahr im Herbst schiebt der Bock sein Geweih ab und bildet es neu.
    • +
+
+
+ + \ No newline at end of file diff --git a/styles.css b/styles.css index 2207125..d10dd8f 100644 --- a/styles.css +++ b/styles.css @@ -55,3 +55,45 @@ button { button:hover { background-color: #2980b9; } + +/* gallery slider */ +.gallery { + display: flex; + justify-content: center; + align-items: center; + position: relative; + height: 300px; + overflow: hidden; +} + +.gallery-img { + max-width: 100%; + max-height: 100%; + opacity: 0; + position: absolute; + transition: opacity 0.6s ease; +} + +.gallery-img.active { + opacity: 1; +} + +/* facts box */ +.fact-box { + max-width: 800px; + margin: 1rem auto; + padding: 1rem; + background: #ecf0f1; + border-radius: 6px; + display: none; + animation: fadeIn 0.5s ease-in; +} + +.fact-box.show { + display: block; +} + +@keyframes fadeIn { + from { opacity: 0; } + to { opacity: 1; } +}