diff --git a/js/carousel/img/01.jpg b/js/carousel/img/01.jpg
new file mode 100644
index 0000000..f1e3b0e
Binary files /dev/null and b/js/carousel/img/01.jpg differ
diff --git a/js/carousel/img/02.jpg b/js/carousel/img/02.jpg
new file mode 100644
index 0000000..4c13804
Binary files /dev/null and b/js/carousel/img/02.jpg differ
diff --git a/js/carousel/img/03.jpg b/js/carousel/img/03.jpg
new file mode 100644
index 0000000..27cf550
Binary files /dev/null and b/js/carousel/img/03.jpg differ
diff --git a/js/carousel/index.html b/js/carousel/index.html
new file mode 100644
index 0000000..003d472
--- /dev/null
+++ b/js/carousel/index.html
@@ -0,0 +1,41 @@
+
+
+
+ Hôtel Molière
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/js/carousel/main.js b/js/carousel/main.js
new file mode 100644
index 0000000..383d900
--- /dev/null
+++ b/js/carousel/main.js
@@ -0,0 +1,68 @@
+const fullscreencar = {
+
+}
+
+let home_car_current = 1;
+
+let home_car_item_length = document.querySelectorAll(".home-car-item").length;
+
+function home_car_init() {
+ document.querySelectorAll(".home-car-item").forEach(
+ function(element, index) {
+ element.style.order = index+1;
+ });
+}
+
+home_car_init();
+
+function home_car_update_order() {
+ if (home_car_current == home_car_item_length) {
+ home_car_current = 1;
+ } else {
+ home_car_current++;
+ }
+
+ let order = 1;
+
+ for (let i = home_car_current; i <= home_car_item_length; i++) {
+ document.querySelector(".home-car-item[data-position='" + i + "']").style.order = order;
+ order++;
+ }
+
+ for (let i = 1; i < home_car_current; i++) {
+ document.querySelector(".home-car-item[data-position='" + i + "']").style.order = order;
+ order++;
+ }
+
+ document.querySelector("#home-car-container").classList.remove('home-car-trans');
+ document.querySelector("#home-car-container").style.transform = 'translateX(0)';
+
+}
+
+function home_car_next() {
+ document.querySelector("#home-car-container").classList.add('home-car-trans');
+ document.querySelector("#home-car-container").style.transform = 'translateX(-100%)';
+ // home_car_update_order();
+ setTimeout(function(){console.log("check")
+ home_car_update_order();
+ },3000);
+}
+
+function home_car_loop() {
+ setInterval( function() {
+ home_car_next();
+ },10000);
+}
+
+home_car_loop();
+
+let vm = new Vue ({
+ el: "#root",
+ data () {
+ return {
+ text1: "Yolo world"
+ }
+ }
+
+})
+
diff --git a/js/carousel/style.css b/js/carousel/style.css
new file mode 100644
index 0000000..8fbcb43
--- /dev/null
+++ b/js/carousel/style.css
@@ -0,0 +1,35 @@
+* {
+ margin: 0px;
+ padding: 0px;
+ box-sizing: border-box;
+}
+
+body {
+
+}
+
+#home-car-outer {
+ overflow: hidden;
+}
+
+#home-car-container img {
+ width: 100%;
+ width: 100vw;
+ height: 100vh;
+ object-fit: cover;
+ vertical-align: bottom;
+}
+
+#home-car-container {
+ display: flex;
+ flex-wrap: nowrap;
+ flex-direction: row;
+}
+
+#home-car-container {
+ transform: translateX(-0vw);
+}
+
+.home-car-trans {
+ transition: transform 2s ease-in-out;
+}