-

Sushil010 · Aug 21, 2024 · 6418210 · 6418210
1 parent 6a91039
commit 6418210
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 5 deletions.
diff --git a/cloned-sites/cyberfiction/index.html b/cloned-sites/cyberfiction/index.html
@@ -11,12 +11,14 @@
 
 
 
-
     <div id="main">
 
         <div id="page1">
             <canvas></canvas>
         </div>
+        <div id="page2"></div>
+        <div id="page3"></div>
+        <div id="page4"></div>
     </div>
 
 

diff --git a/cloned-sites/cyberfiction/script.js b/cloned-sites/cyberfiction/script.js
@@ -420,4 +420,48 @@ function canvasimg(){
     });
   }
 
-  canvasimg();
+  canvasimg();
+
+
+
+
+
+gsap.to("#page1",{
+  scrollTrigger:{
+    trigger:"#page1",
+    start:"top top",
+    end:"bottom top",
+    scroller:"#main",
+    pin:true
+  }
+})  
+
+gsap.to("#page2",{
+  scrollTrigger:{
+    trigger:"#page2",
+    start:"top top",
+    end:"bottom top",
+    scroller:"#main",
+    pin:true
+  }
+})  
+
+gsap.to("#page3",{
+  scrollTrigger:{
+    trigger:"#page3",
+    start:"top top",
+    end:"bottom top",
+    scroller:"#main",
+    pin:true
+  }
+})  
+
+gsap.to("#page4",{
+  scrollTrigger:{
+    trigger:"#page4",
+    start:"top top",
+    end:"bottom top",
+    scroller:"#main",
+    pin:true
+  }
+})  
diff --git a/cloned-sites/cyberfiction/stle.css b/cloned-sites/cyberfiction/stle.css
@@ -15,13 +15,13 @@ html,body{
 }
 
 #page1 canvas{
-    position: relative;
+    /* position: relative; */
     max-height: 100vh;
     max-width: 100vw;
 }
 
 
-/* 
+
 #page1{
     height: 100vh;
     width: 100vw;
@@ -44,4 +44,4 @@ html,body{
     height: 100vh;
     width: 100vw;
     background-color: rgba(255, 187, 0, 0.804);
-} */
+}