Skip to content

Create dynamic anchors on load #209

@SebastianUhlig

Description

@SebastianUhlig

Hello. I have a problem, similar to some of the others who I've read this before.

It's about the anchors. Since I wanted mine to be dynamic with Laravel, I pack the entire pagepiling as @Push ('scripts_footer') and then let it load as soon as the dom is ready.
So far so good.
Now I wanted to set the anchors dynamically. To do this, I go to the navigation when building the page and pack the ids in a Laravel variable, which I then insert via @stack on pagepiling.
This also works, but not if you try to call the anchor via a link. But only on Firefox and some other browsers. On Chrome, for example, it works. Is there an alternative way to do this?

            $('.pagepiling').pagepiling({
                scrollingSpeed: 280,
                loopBottom: false,
                keyboardScrolling: true,
                anchors: [@stack('anchors')],
                menu: '#anchor_subnav',
                afterRender: function() {
                    $('#pp-nav').addClass('change');
                },
                afterLoad: function (anchorLink, index) {
                    if (index >= 2) {
                        $('.logo').removeClass('d-block').addClass('d-none');
                        $('.logo-dark').removeClass('d-none').addClass('d-block');
                        $('.open-menu').addClass('change');
                        $('#pp-nav').removeClass('change');
                    }

                    if (index == 1) {
                        $('.logo').removeClass('d-none').addClass('d-block');
                        $('.logo-dark').removeClass('d-block').addClass('d-none');
                        $('.open-menu').removeClass('change');
                        $('#pp-nav').addClass('change');
                    }

                    if (index == sections) {
                        $('footer').addClass('active');
                    } else {
                        $('footer').removeClass('active');
                    }
                },
            });

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions