Scrolling Anchor Links - Not Working With Loopers

[stilemas]

Hello!

Not sure if I’m overlooking something, but I have some anchor links that are being generated by Looper content where the animation to the section is not working. If I replace the looper-generated content with static content the animation works.

Here is a URL to preview:

Car Accidents and Automobile Collisions - Schiffman Firm - Pittsburgh...

The setup is as follows:

1. The section above the content features a series of Looper generated buttons that point to the content (also Looper generated) below
2. The button href is set to dc:looper:index
3. Each section below has an div ID of dc:looper:index to correspond

The links themselves work just fine, just the scroll to animation is not existent.

As an example, I’ve included a static button that points to static content on the page - “More Frequently Asked Questions”. When clicked, you’ll see the scroll to animation works.

Any ideas?

Thanks!

[ruenel]

Hello Tyler,

Thanks for writing in! The animation scrolling is not working because you are linking to the Row element. You should be using Section as your Looper Provider and Looper Consumer so that the ID can be generated on the Section and not on the Row element.

If you are not following, please provide us the access to your so that we can check your Looper provider settings. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
​

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[stilemas]

Thanks, @ruenel!

I switched the looper consumer settings to the section rather than the row. The links to the anchors work, but still no scroll animation.

I’ve attached a Secure Note with login details.

[ruenel]

Hello Tyler,

Thanks for the information.

• https://www.w3schools.com/tags/att_global_id.asp

Using a number as your element ID may create issues sooner or later. That is why, you should change your naming ID by adding section-{{dc:looper:index}} instead.

Kindly let us know how it goes.

[stilemas]

@ruenel - makes sense! I thought I had tried something like that earlier, but maybe it was because the anchors were still set to the ‘rows’ and not the individual ‘sections.’

Looks like you or someone else already made the change and it works flawlessy!

Thanks so much, take care!

[ruenel]

Hey Tyler,

Yes, the anchor should be added to the Section element and must not be a single Number character. The IDs were changed already to demonstrate why it is not working and what needs to be done to make it work. Please feel free to create another thread if you need any further information.

Cheers.