diff --git a/app/(pages)/carousel-part-cleaned/carousel.tsx b/app/(pages)/carousel-part-cleaned/carousel.tsx
index 7b98aeb..bad90d8 100644
--- a/app/(pages)/carousel-part-cleaned/carousel.tsx
+++ b/app/(pages)/carousel-part-cleaned/carousel.tsx
@@ -12,6 +12,7 @@ import {
 // @ts-ignore
 import useKeypress from "react-use-keypress";
 import clsx from "clsx";
+import useWindowSize from "@buildinams/use-window-size";
 
 let fullAspectRatio = 3 / 2;
 let collapsedAspectRatio = 1 / 3;
@@ -29,14 +30,14 @@ export default function Carousel({ images }: { images: string[] }) {
   const { push } = useRouter(); // push instead replace to go back and forth in the browser's history
   const searchParams = useSearchParams();
 
-  const currentPage = Number(searchParams.get(PAGE)) || 0;
+  const currentPage = Number(searchParams.get(PAGE)) || 0; // default O
 
   const currentNoDistraction =
     searchParams.get(NODISTRACTIONS) === "true"
       ? "true"
       : searchParams.get(NODISTRACTIONS) === "false"
         ? "false"
-        : "false";
+        : "false"; // default false
 
   const currentObjectFit =
     searchParams.get(OBJECTFIT) === "contain"
@@ -45,7 +46,7 @@ export default function Carousel({ images }: { images: string[] }) {
         ? "scroll"
         : searchParams.get(OBJECTFIT) === "cover"
           ? "cover"
-          : "cover";
+          : "cover"; // default cover
 
   let index = currentPage;
   let noDistracting: "false" | "true" = currentNoDistraction;
@@ -152,9 +153,15 @@ export default function Carousel({ images }: { images: string[] }) {
   });
 
   let height = useMotionValue(0);
+  const { width } = useWindowSize();
   useEffect(() => {
     height.set(document.getElementById(`${IMAGEID + index}`)!.clientHeight);
-  }, [height, index, objectFitting]);
+  }, [index, objectFitting, width]);
+
+  /* NEXT UP WOULD BE:
+  - a images folder selector based on the folders in public
+  - making images work in the dependency array or otherwise when a different folder is selected
+  */
 
   return (
     <div className="flex max-h-screen items-center overflow-y-hidden bg-black">
diff --git a/app/(pages)/carousel-part-cleaned/page.tsx b/app/(pages)/carousel-part-cleaned/page.tsx
index 288c179..96e20aa 100644
--- a/app/(pages)/carousel-part-cleaned/page.tsx
+++ b/app/(pages)/carousel-part-cleaned/page.tsx
@@ -1,4 +1,4 @@
-import * as fs from "node:fs";
+// import * as fs from "node:fs";
 import { Suspense } from "react";
 
 import Carousel from "./carousel";
@@ -18,7 +18,7 @@ let images: string[];
 // ]);
 // imagesForSorting.sort((a, b) => a[1] - b[1]);
 // images = imagesForSorting.map((e) => e[0]);
-// console.log(images);
+// // console.log(images);
 
 /* Replacing the copypasted multiple images. */
 const imagesDynamized = (x: number) => {
diff --git a/package-lock.json b/package-lock.json
index 3ebf524..f19c7fe 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "framer-motion-recipes",
       "version": "0.1.0",
       "dependencies": {
+        "@buildinams/use-window-size": "^0.0.1",
         "@uidotdev/usehooks": "^2.4.1",
         "clsx": "^2.1.1",
         "date-fns": "^3.6.0",
@@ -46,6 +47,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/@buildinams/use-window-size": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/@buildinams/use-window-size/-/use-window-size-0.0.1.tgz",
+      "integrity": "sha512-fSyKUFEvyjdkAi8KkYo8Rd/1WijJPttYkfVReVK8QGVlkDrKD2wD9r6917qwuTr99H+GiMT8+ut8Yntz9piwHQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": ">=17.0.0 || 18"
+      }
+    },
     "node_modules/@emnapi/runtime": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.2.0.tgz",
diff --git a/package.json b/package.json
index b8bec2a..0c1071c 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@buildinams/use-window-size": "^0.0.1",
     "@uidotdev/usehooks": "^2.4.1",
     "clsx": "^2.1.1",
     "date-fns": "^3.6.0",