Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Content Count

  • Joined

  • Last visited

Community Reputation

2 Newbie

About IbraheemHaseeb

  • Rank

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hello there, So, I wrote this code for different screen sizes and it seems that as I go to a lower screen, multiple queries get called which causes glitches in my code instead of calling only one query. Kindly let me know how can I make these queries mutually exclusive such that they don't mess with each other. You can see there is a white box in the code and when I scroll down it works fine but scrolling up glitches it. How do I stop other queries to get called?
  2. can you tell me how can I make them mutually exclusive?
  3. it kinda move a little to the left when you scroll up, works fine during scrolling down but up has this bug
  4. So I am attaching the code where when I am scrolling down, the text is working absolutely fine but when I scroll back up it displaces weirdly. Can anyone help me why is this happening? The issue is with the text "Lets Discover"
  5. Thank you so much for your time. ❤️
  6. So in the code you can see that I have added the end: "bottom bottom" such that the end trigger for the element goes to the bottom which in this case should be the bottom of the screen. But for some reason its not going there. Instead its struck to the bottom of the ".one" div container. Kindly help me out here what am I doing wrong. Best Regards, Ibraheem.
  7. I have created some scroll triggers which are not really quite working out together the way I want them to work. I am sure its not a big problem. Its just a tiny fix and it will be working absolutely fine. I would really appreciate if someone can help me out with that.
  8. Yes somehow if its possible to take over the velocity I would like that. Or is there a way that once my first zoom-in is done I make it pin and that pin last for some scrolling and then the rest of the zoom-out continues from that exact point.
  9. I can extend the end value to delay it or lower the start value but that just makes the animation start a little early. I want it to start at the defined time but scalling to go slowly
  10. Hi there, So I have this code up there you can see and I want my scrub animation to go slowly rather than it being dependent on the scrolling speed. Yes, I know about giving value of scrub:1, but that just makes it smooth not slow. I want it to go slowly in order to make this animation last long. // ignore the css and images as they are just for demonstration here. The original thing is different.
  11. I am making a little scrub animation where when I scroll down image zooms in using the scale property and when I am zooming in I want some text to change its opacity from 0 to 1 to make it appear. And when I scroll further down I want that thing to fade out by changing the opacity to 0 again. Can anyone help me? My problem is that I don't know how to make different things animate on a scroll trigger. So far here I am. Obviously you cant see the result because there is Thank you for your time.
  12. Okay so I wrote this code such that when I am scrolling it zooms in to an image and when I further scroll it zooms out to its original state of scale:1. Maybe my codepen URL won't work because of the locally stored images. Can anyone just help how to zoom in with scroll then maintain that zoomed in state and then zoom out from that zoomed in state. My code just jumps to zoomed out state with going slowly with scrub:true . index.html style.css app.js