ios Slider默认为最后一张幻灯片

Question

On the initial page load my iosSlider has the first tab displayed on the first slide, however when I click any other tab it goes to the last slide within that group. Any ideas how to make it go to the first slide?

My HTML code (on jsfiddle as its kinda long for this page)

http://jsfiddle.net/Ky8am/

My JS code

    /* main carousel */
$( "#mainCarousel .iosslider" ).iosSlider( {
    autoSlide: true,
    autoSlideTimer: 10000,
    desktopClickDrag: true,
    navSlideSelector: $( "#mainCarousel .iosslider-indicators > ul > li" ),
    onSlideChange: mainCarouselSlideChange,
    onSliderLoaded: mainCarouselSliderLoaded,
    snapToChildren: true,
    startAtSlide: 1,
} );

Answer 1

Depends on your mark up. So if you have something like

<div class='fluidHeight'>
    <div class='sliderContainer'>
        <div class='iosSlider'>
            <div class='slider'>                
                <div class='item' id="s_1" number="1"><img src = 'http://lorempixel.com/800/500/sports/1/' /></div>
                <div class='item' id="s_2" number="2"><img src = 'http://lorempixel.com/800/500/sports/2/' /></div>
                <div class='item' id="s_3" number="3"><img src = 'http://lorempixel.com/800/500/sports/3/' /></div>
                <div class='item' id="s_4" number="4"><img src = 'http://lorempixel.com/800/500/sports/4/' /></div>
                <div class='item' id="s_5" number="5"><img src = 'http://lorempixel.com/800/500/sports/5/' /></div>
                <div class='item' id="s_6" number="6"><img src = 'http://lorempixel.com/800/500/sports/6/' /></div>
            </div>                          
        </div>
    </div>
</div>

You may try to use this code:

$( ".item" ).click(function() {
    $('.iosSlider').iosSlider('goToSlide', 1)
});