flickity icon indicating copy to clipboard operation
flickity copied to clipboard

Adds option sliderTagName to allow for specifiying HTML element of the slide wrapper

Open jeryj opened this issue 6 years ago • 5 comments

I ran into an issue where I wanted the individual slider items to be <li>s, but the .flickity-slider is set to be a <div> with no option to change it. I needed .flickity-slider to be a <ul> for valid HTML.

This PR introduces the option sliderTagName to pass the tagName you want to use for your .flickity-slider so you can use any tagName you want.

jeryj avatar Feb 02 '18 21:02 jeryj

Thanks for opening this PR. It's a neat addition, but I'm not sure how useful it is. The slider is not necessarily a good list item, as there is only ever one of them in the Flickity instance.

Anyways, I'll keep this PR open for a bit to see if there's any other interest. Add a 👍 reaction to this issue if you would like to see this feature added. Do not add +1 comments — They will be deleted.

desandro avatar Feb 09 '18 19:02 desandro

@desandro My intention was for the slider to be a <ul> or <ol> and have the slider children be <li>s. I agree that the slider wrapper being an <li> would be questionable :)

On a site I'm working on we're displaying trending articles in a Flickity slider. Having the slide wrapper be an <ol> with each slide an <li> would be the ideal HTML. This PR would allow the slider to have HTML like:

<ol class="flickity-slider">
    <li class="trending-post">....</li>
    <li class="trending-post">....</li>
    <li class="trending-post">....</li>
</ol>

jeryj avatar Feb 09 '18 19:02 jeryj

ah! right, thanks for clearing that up. Yeah, that semantically makes sense.

desandro avatar Feb 09 '18 19:02 desandro

Was this ever added as an option to Flickity?

AndreMarquesDev avatar Apr 08 '19 12:04 AndreMarquesDev

I agree - I would love to see this feature get merged in. I have a component that I am building that has somewhat painted me in a corner as far as needing to use <ul>\<li> as the flickity slider. It would be great to have this additional flexibility!

tklives avatar Aug 12 '19 16:08 tklives