Is it possible to set up a slider that has multiple slides in it (for example 10).

And have 10 different buttons that calls only one specific slide to show when the user clicks on it?

Rather than creating 10 different layersliders, it all happens within the one layer slider.

I've been writing JS for it but cannot get it to work. Each time it only recalls the first slide on every button. I cannot get to the slide #2 or #3 etc.

Surely there's a function to do this, it seems so simple but I cannot make it work.

Hi George, looks like I have not explain myself well enough, lets start again:

In Project settings > layout > open by click > I can add a trigger here, I used ".popup-trigger"

This opens the entire layer which is great! BUT...

Can I be specific to opening individual slides (not just slider 1)?

BUTTON EXAMPLE:

<!-- Button to open the popup and go to Slide 1 -->
<button class="popup-trigger" data-slide="1">Open Slide 1</button>

<!-- Button to open the popup and go to Slide 2 -->
<button class="popup-trigger" data-slide="slide3">Open Slide 2</button>

I TRIED JAVA (It does not work, it continue to only open up slide 1)

jQuery(document).ready(function($) {
    $('.popup-trigger').on('click', function(e) {
        e.preventDefault();

        // Get the slide number directly from the button's data-slide attribute
        var targetSlide = $(this).data('slide');
        console.log("Opening popup and navigating to slide number: " + targetSlide);

        // Open LayerSlider popup
        $('#layerslider_30').layerSlider('open');

        // Delay to ensure popup opens, then navigate to the target slide by slide number
        setTimeout(function() {
            $('#layerslider_30').layerSlider('goToSlide', targetSlide); // Go to specified slide number
        }, 200); // Adjust delay if needed
    });
});

I dont want to create 10 different layer sliders for the one page - it's too much code for the site to scroll through.

How do I access a popup based on the slide #?

Thanks,

Denis.

the trigger is on my website page (not the layerslider)

Example: 

Button 1 (on home page) opens up slide 1 on [layer-slider ID=30]

Button 2 (on home page) opens up slide 2 on [layer-slider ID=30]

Button 3 (on home page) opens up slide 3 on [layer-slider ID=30]

etc...

This way the page only loads one layerslider upon page load (not several). And then each separate button calls a specific slide