[Pinned section inside scrolling with scrollsmoother]

Hi guys, how can i make the left side(the scrollable), more controllable and slow. At this time as soon as the section is pinned, i lose control of the scrolling, so i find it difficult for example to go to the first itinerary or the very top of content in general

See the Pen vYjxVQY?editors=1010 by babistsour (@babistsour) on CodePen

[Trying draw svg arrow]

Anyone wanna help guys?

[Trying draw svg arrow]

Hi agains folks,  sorry for pestering you with this one, but i need to solve this. I managed to make the correct path. So, the issue that arises now ,is that the svg path is always in the top left corner. 1) i want to put it in the middle of the container div. 2) How to use round cap in path, only at the side of the arrow and not in the beginning of the path . I m trying to move the svg elsewhere inside the container div, but it takes the whole image background with it. I want to put it anywhere i want but the bg image to remain full stretched to the container. Sorry and thank you again!!

 

See the Pen gOKaJGr by babistsour (@babistsour) on CodePen

 

[Trying draw svg arrow]

Hi guys i reopen the topic because i cant change the path to the correct one, i want the exact same path as my example , because its the clients logo. But when i change the path, everything is acting weirdly.

[Trying draw svg arrow]

Hi guys, i m trying to animate this masked arrow svg from 0% to 100% but it doesnt work. What i m doing wrong?

See the Pen PoeMNpV by babistsour (@babistsour) on CodePen

[Jitterish sticky element on scroll(Scrollsmoother)]

Hi Rodrigo, thank you for your answers. I put in the navbar a "will-change: transform" and the problem has gone. As  for the green section, i didnt understand the solution. Do you suggest not to animate the width, but something else. Sorry, noob here..

[Jitterish sticky element on scroll(Scrollsmoother)]

i Cant reproduce the code right now because of the complexity of the structure and dependecies but its similar to this codepen

See the Pen vYjxVQY by babistsour (@babistsour) on CodePen

here the image on the left in green section is also flickering and shaking when the animation is in progress. But it only happens in chrome. IN firefox its ok.

[Jitterish sticky element on scroll(Scrollsmoother)]

Hi guys, i have made a sticky bar( the white one ) in this page http://btr.radial.website/en/roadtrips/tour1/ , but only in chrome the links and the button are shaking as i scroll the page. What might be the problem. The code is this simple one

const innerNavigation = document.querySelector(
			'.inner-navigation__container'
		)
		if (innerNavigation) {
			ScrollTrigger.create({
				trigger: innerNavigation,
				start: 'top 54px',
				endTrigger: '#accomodation',
				toggleClass: 'active',
				pin: true,
				scrub: true,
				pinSpacing: false,
			})
		}

 

[Scrollsmoother with scollable area inside sticky section]

Thank you very much guys. I did it. I put the width to go from 70% to to calc(100% - 64px), so i managed the desired margin for both sides to be 32px. THanks a lot

[Scrollsmoother with scollable area inside sticky section]

Yes Cassie. Exaclty that. But with the ability  for the green section to grow as i scroll. Like my example. I put the code for that, but something goes wrong. Something like this.(Look at the video section)  https://goclass.webflow.io/

[Scrollsmoother with scollable area inside sticky section]

Hi guys, i want in this code, when i scroll to green section to be sticky and as this is sticky, the right content to be scrolled .And when it finishes, to continue scrolling to section 3. I managed to make it sticky but as soon as the green section become sticky, then the content behind was scrolling and not the inside content. I hope you understand...

See the Pen vYjxVQY by babistsour (@babistsour) on CodePen