Note that there are some explanatory texts on larger screens.

plurals
  1. POModify jQuery slider to start in different position
    primarykey
    data
    text
    <p>I'm using a slider that I got from another SO post - the original fiddle is <a href="http://jsfiddle.net/mjaA3/332/" rel="nofollow">here</a>. I'm still pretty new to jQuery. </p> <p>I've figured out how to stop it from playing automatically, but I was wondering if there is a way to modify the code so that it starts on a different slide other than 1? I have received a request to start it on the 2nd slide without removing the first.</p> <p>This isn't a plugin like WowSlider or anything like that, just got the code from an awesome person on this site. Here is my jQuery and <a href="http://jsfiddle.net/psaj9/" rel="nofollow">here is a fiddle</a> with everything.</p> <pre><code> var thumbs = $('ul.thumbHolder li');var bigImgs = $('ul.imgHolder li'); var mask = $('.imgHolder'); var imgW = $('ul.imgHolder li').width(); var speed = 300; thumbs.removeClass('selected').first().addClass('selected'); thumbs.click(function () { var target = $(this).index(); mask.animate({ 'left': '-' + imgW * target + 'px' }, speed); thumbs.removeClass('selected'); $(this).addClass('selected'); }); $('.Bleft').on('click', function () { var i = $('ul.thumbHolder li.selected').index(); i--; $('ul.thumbHolder li.selected').removeClass('selected'); thumbs.eq(i).addClass('selected'); if (i === -1) { mask.animate({ 'left': '-' + imgW * $('ul.thumbHolder li').index() + 'px' }, speed); } else { mask.animate({ 'left': '-' + imgW * i + 'px' }, speed); } clearInterval(counter); }); $('.Bright').on('click', function () { var i = $('ul.thumbHolder li.selected').index(); i = i &gt;= thumbs.length - 1 ? 0 : i + 1; $('ul.thumbHolder li.selected').removeClass('selected'); thumbs.eq(i).addClass('selected'); mask.animate({ 'left': '-' + imgW * i + 'px' }, speed); clearInterval(counter); }); var count = 0; var counter = window.setInterval(timer, 5000); function timer() { count = count + 0; if (count &gt;= 0) { count = 0; return; } mask.animate({ 'left': '-' + imgW * count + 'px' }, speed); thumbs.removeClass('selected'); thumbs.eq(count).addClass('selected'); } </code></pre> <p>Thanks in advance for any help!</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload