diff --git a/components/narrative/Narrative.tsx b/components/narrative/Narrative.tsx
index 8c413f7..e147c83 100644
--- a/components/narrative/Narrative.tsx
+++ b/components/narrative/Narrative.tsx
@@ -21,14 +21,14 @@ const Narrative = () => {
             {
                 openNarrative && (
                     <>
-                        <img src="/logos/floodgen_logo_white.png" className="absolute left-8 top-6 w-[155px] h-[38.75px] z-[999]" alt="logos_white" />
+                        <img src="/logos/floodgen_logo_white.png" className="absolute left-8 top-6 w-[155px] h-[38.75px] z-[999] " alt="logos_white" onScroll={() => console.log('aa')}/>
                         <div className="absolute right-8 top-6 flex items-center justify-center w-[35px] h-[35px] bg-[#E7E7E7] bg-opacity-60 rounded-full z-[999] cursor-pointer">
                             <XMarkIcon width={24} height={24} className=" text-black font-thin " onClick={clickHandler} />
                         </div>
                         <div className="absolute top-0 left-0 z-50 w-full h-full overflow-y-auto">
                             <Introduction />
                             <Satellite />
-                            <StreetView />
+                            {/* <StreetView /> */}
                             <Slider />
                             <Ending clickHandler={clickHandler}/>
                         </div>
diff --git a/components/narrative/Slider.tsx b/components/narrative/Slider.tsx
index 8243626..99777be 100644
--- a/components/narrative/Slider.tsx
+++ b/components/narrative/Slider.tsx
@@ -1,13 +1,15 @@
 "use client";
 
 import Image from "next/image";
-import { useState } from "react";
+import { useState, useRef, useEffect } from "react";
 import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/16/solid";
 
 const Slider = () => {
     const [sliderPosition, setSliderPosition] = useState(50);
     const [isDragging, setIsDragging] = useState(false);
 
+    const ref = useRef()
+
     const handleMove = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
         if (!isDragging) return;
 
@@ -26,8 +28,9 @@ const Slider = () => {
         setIsDragging(false);
     };
 
+
     return (
-        <div className="w-full h-[100vh] bg-white relative" onMouseUp={handleMouseUp}>
+        <div className="w-full h-[100vh] bg-white relative" onMouseUp={handleMouseUp}  >
             <div
                 className="relative w-full h-full overflow-hidden select-none"
                 onMouseMove={handleMove}