Kory Question Time

Hi @kory

Not looking for much more than confirmation whether it is possible (or not) to have a slider element within a slide

ie I have a Tabbed Section (that uses the slider element) and want to put a slider in the content of the ‘parent’ slide

Sorry for the non beta topic, but thought I’d try and grab your ear while I could

Thanks

Scot

@scotbaston, I think I’m following correctly, but is there possibly a way you could do kind of a pseudo markup tree for me or something so that I understand how you’re trying to structure things? It sounds kind of like this to me:

  • Tabbed Section
    • Slider
      • Slide
        • Another Slider Here?

If that’s not correct, let me know. If I’m following correctly, in general I would say that a Slider inside of another Slider while potentially technically possible will not be the most solid user experience unless you have some very particular pattern you’re trying to accomplish and maybe the inner slider is autoplaying so it’s more of a designed element rather than nested content people will need to navigate through? Just my general thoughts off the top of my head.

It’s possible to put a slider in a slide. I’ve done it for a slider with testimonials where each slide had another slider in it to show a before/after image comparison.

1 Like

Exactly, @JvP, that’s what I meant…something that’s more akin to an animated graphic or something like that for the nested Slider. Anything other than that, I would likely not use this pattern personally if it meant navigating to critical content.

1 Like

Hi @kory, Thanks for looking at this

I don’t have an actual tabbed section, I am using the new slider element as a tabbed section (I’ll add a link in the super secret section below)

but it looks something like this

1 Like

I see, @scotbaston! Thanks for sharing that link…very cool implementation and idea! Something like this is more like what I was mentioning…in the way you’re using this, it’s not done in an “anti-pattern” kind of way where people are having to traverse some convoluted tree of interactions to get to core content. So you’ve basically made “tabs” out of the top parent slider using the data-x-slide-goto feature to create a custom navigation, and then each “tab” inside of there will potentially have a child slider moving through some images. In theory that should all work! I haven’t tested something as extensive as this myself, but I would just do the things that you seem to have already done yourself (make sure any sort of dragging interactions are turned off on the parent, et cetera). You’ll just want to make sure it’s all configured to your liking.

Hopefully that helps!

1 Like

Thanks @kory,

I have tried the child slider and it works, and it doesn’t…

the slider works on interval, but both the pagination and the navigation affect the parent slider

the linked page in the above secure note has been updated to show what I mean, the child slider has 2 slides, the parent slider has 4 slides. the child pagination shows 4 slides instead of 2 and the child navigation affects the parent slider

is there any way of targeting the navigation ( data-x-slide-prev & data-x-slide-next ) to target a specific slider?

in case you are interested I am including the template & JS below for your enjoyment

Hey, @scotbaston…thanks for writing in. Unfortunately, I can’t dig into this one much more at the moment as it’s not really within the scope of this beta. In general, the slider functionality wasn’t really built with this idea in mind of nesting multiple instances, so I’m sure there will be some issues with navigation and things like that as you mentioned. It’s something that possibly down the road we might have more of a chance to look into and in more detail. Thanks.

no problem, I realise its outside of the scope of this beta

Thank you for your understanding while we start wrangling this thing in!