Add Nuxt

app/components/startseite/Jarallax.vue

@@ -0,0 +1,60 @@
+<template>
+    <div class="parallax-wrapper">
+      <div
+        class="jarallax"
+        ref="parallaxEl"
+        data-speed="0.5"
+      >
+        <div class="jarallax-img" style="background-image: url('https://ritzenbergen.de/Fotos/erntefest2011.jpg');">
+
+        </div> 
+        <div class="container content cid-u6k7q0zosO">
+          <slot></slot>
+        </div>
+      </div>
+    </div>
+  </template>
+  
+  <script>
+  import { jarallax } from 'jarallax';
+  import 'jarallax/dist/jarallax.css'; // optional, falls du Styles möchtest
+  
+  export default {
+    name: 'ParallaxSection',
+    mounted() {
+      jarallax(this.$refs.parallaxEl);
+    },
+    beforeDestroy() {
+      jarallax(this.$refs.parallaxEl, 'destroy');
+    },
+  };
+  </script>
+  
+  <style scoped>
+  .parallax-wrapper {
+    overflow: hidden;
+  }
+  
+  .jarallax-img {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-size: cover;
+    background-position: center;
+    z-index: -1;
+  }
+  
+  .container {
+    position: relative;
+    z-index: 1;
+    padding: 100px;
+    text-align: center;
+  }
+  slot{
+    width: 100%;
+    height: 100%;
+  }
+  </style>
+