Nested Sliders as iOS UI elements

[t0rpedo]

Has anyone had any experience in trying to nest sliders in order to build out interface elements for mobile environments?

For example:

<div id="slider">
    <div class="slide">
        <div id="slider-a">
            <div class="slide-a"></div>
            <div class="slide-a"></div>
            <div class="slide-a"></div>
        </div>
    </div>
    <div class="slide">
        <div id="slider-b">
            <div class="slide-b"></div>
            <div class="slide-b"></div>
            <div class="slide-b"></div>
        </div>
    </div>
    <div class="slide">
        <div id="slider-c">
            <div class="slide-c"></div>
            <div class="slide-c"></div>
            <div class="slide-c"></div>
        </div>
    </div>
</div>

I'm concerned that the touch events will interfere with each other. Thought I would ask if anyone has tried this before I decide to use these elements in my application.

[marcwhitbread]

Overlapping touch events will be a problem. I am assuming the child sliders (a, b, c) would want to lock the parent correct? This can be avoided by disabling touch events on the parent by using unselectableSelector. Add a class to the child sliders (ex. unselectable). So like this:

$('.slider').iosSlider({
    unselectableSelector: '.unselectable'
});

You can also play with the public lock and unlock methods to see if that gets you anywhere.

[t0rpedo]

This sounds like it's going to be a fun little bird's nest of code and event ignores. I'll close for now and reopen if I or anyone else runs into any issues. Thanks!