Snap the image using pin section.

[Renish]

Some how we cant found proper swipe image length bottom to top. i tried this code using codepen platform. i get the array count 4 and i want to change on snap "true" & pin "true" position 4 slider. but it's not working fine. can you help me. please check my demo it's sort and simple.

See the Pen KKZaKjj by RenishEn (@RenishEn) on CodePen

[OSUblake]

Welcome to the forums @Renish

 

You need to use an ease of "none" on your animations for the snapping to be linear.

 

tl.to(".loadimg", {duration: 1, yPercent: -100 * (sections.length - 1), ease: "none"} )
.to(".titletag", {duration: 1, yPercent: -100 * (sections.length - 1), ease: "none"}, "-=100%" )

 

[Renish]

@OSUblake Thank you so much for your response.

Sir as you said my title swiping problem will be solved thank you but i want to change content also in bottom of the title section. 

entire  section will be pin but on single scroll want to change the image (y axis), title (y axis) and content (fade in/out - related to the which image was active) - - -

See the Pen KKZaKjj?editors=1111 by RenishEn (@RenishEn) on CodePen

Also so i change the code logic on my codepen demo so can you have look in it .  

As beginner knowledge i almost completed the what i want but bottom content section not working proper on single scroll.  contents are change when image will be change.    

demo link if you don't understand my expaination. - https://franciscamoura.com/