Better handling of responsive prop

[viktorlarsson]

Tiny-slider has a good, but a bit complex way of setting responsive options. We need a better way to handle this.

<tiny slider:responsive="{480:{items:1},768:{items:2},992:{items:2},1200:{items:3},2300:{items:4}}"

[blipps199]

Tiny-slider has a good, but a bit complex way of setting responsive options. We need a better way to handle this.

<tiny slider:responsive="{480:{items:1},768:{items:2},992:{items:2},1200:{items:3},2300:{items:4}}"

I really can't get it to work right. Not sure if I'm doing something wrong or what. I've tried what you mentioned and also tried vbind and putting the attributes in the js file. I can get all the other configs to work but the responsive one I have no luck with. Seems like it will use what I have in responsive but its overwriting the other options.

This is what I have in the js file and I have vbind on the the slider mainSliderOptions: { mouseDrag: true, controls: false, nav: false, autoplayButtonOutput: false, items: 1, edgePadding: 400, gutter: 15, responsive: { 640: { edgePadding: 20, gutter: 20, items: 2 }, 700: { gutter: 30 }, 900: { items: 3 }, 1199: { edgePadding: 0, } } }