Kevin Powell - CommunityKP-C
Kevin Powell - Community2y ago
18 replies
vic

overflow scroll issue during transition in framer-motion

i post the video of my project in comment of these posts
i set overflow hidden and it works but i cant scroll on projects section which needs scroll but i try overflow auto for only project.jsx but it doesnt work cuz i set overflow hidden on body on other components , if i set overflow hidden on certain div it doesnt work

for now i only sent the framer motion animation code ..
code :
 <motion.div id="project-container" 
        initial={{
            opacity:0
        }}
        animate={{
            opacity:1,transition:{
                delay:0.3,
            }
        }}
        exit={{x: "100vw" , transition:{
            ease:"easeInOut",
            duration:0.3
        }}}
        >
       



Home.jsx
<motion.div id="container" 
        initial={{ opacity:0 }}
        animate={{ 
            opacity :  1 ,transition:{
            delay:0.3
        }}}
        exit={{x:"-100vw",transition:{
            ease:"easeInOut",
            duration:0.3,
        }}}
       
        >

contact.js
   <motion.div id="contact-container" 
        initial={{
            opacity:0
        }}
        animate={{
            opacity:1
        }}
        exit={{x: "100vw" , transition:{
            ease:"easeInOut",duration:0.3
        }}}

About.js
 <motion.div id="skills-container"
        initial={{
            opacity:0
        }}
        animate={{
            opacity:1,transition:{
                delay:0.3
            }
        }}
        exit={{x: "-100vw" , transition:{
            ease:"easeInOut"
        }}}
        >
Was this page helpful?