Hi ClaPat,

I have a question about the smooth scroller. Because it interferes with all the scrolltrigger animations I try to add. I can totally understand if this is beyond the support, so no hard feelings there, but I still wanted to try and ask if maybe somebody has a simple solution.

I think its maybe similar to the trigger I needed to change the header on scroll you helped me with but I could not resolve the horizontal scroll problem.

I found some simple tutorials to make a horizontal scroll section with elementor. They work when I turn of the smooth scroll. But not when its on. Nothing works. I wanted to use the horizontal scroll option on this page:

https://toplijn.nl/toplijn/

In the team section  (halfway on the page). I've added a HTML block with the javascript code in that section (called row 03 teamscroll). This is the tutorial I used: 

I tried to change the code with ChatGPT since I have almost no knowledge about javascript, but that didnt work. I did find out that it had a problem finding its position since im using the smooth scroll but not how to fix it.

I also tried to make a more simple horizontal scroll sections just to see if I could get it fixed, but no luck with that either (see toplijn.nl/hanneke). I wont use full sections like in this example, but used it just to test. Also changed this code with chat GPT with no luck.

So in short: Do you have a simple fix to change the script code on the toplijn.nl/toplijn page (team section). So it does not interfere with the smoothscroll

Thank you for your reply and time to take a look.

Kind regards, Hanneke
ps. login details I will send in a private reply

Hi Clapat,

Im sorry that i didnt reply before. I see now that you add an extra line of code when smooth scroll is on, to trigger a scrolling effect on a button. 

So maybe it is possible to write a simple line of code that turns the smooth scroll off on a row for example with the ID "teamscroll-toplijn". Because when its off, all effects work normal.

I tried something in the css code like this but that didnt work:

#teamscroll-toplijn {scroll-behavior: auto !important;}

And also added a JS code to childscript.js

document.getElementById('teamscroll-toplijn').scrollIntoView({
  behavior: 'auto'
});

The row with the ID #teamscroll-toplijn is visible on this page: https://toplijn.nl/toplijn/

Maybe you can tell me what im doing wrong.

Hope you can help me

Thank you in advance. Kind regards, Hanneke