jquery loop through array and reverse

Question

How can I loop through this array which changes the css background color chronologically rather than randomly and reverse through the same array when the back button is clicked?

http://jsfiddle.net/qK2Dk/

$('#right').click(function(){

var bgImages = ["#fff", "#f00", "#000", "#f0f", "#ccc", "#ddd", "#eee", "#bbb"];
var bgImage = bgImages[Math.floor(Math.random() * bgImages.length)];
var image = bgImage;

var element = document.getElementById('bgImage');
element.style.background  = image; // IE fallback

});


<a class="left carousel-control" id="left" href="#carousel" data-slide="prev">
<span>Left</span>
</a>
<br />
<a class="right carousel-control" id="right" href="#carousel" data-slide="next">
<span>Right</span>
</a>

<div id="bgImage">
test
</div>

Start with 0 and store its array index. Change image accordingly — Satpal
– Satpal, Commented Dec 6, 2013 at 13:05

Anand Jha · Accepted Answer · 2013-12-06 13:10:44Z

1

Try this

var ix=0;
$('#right').click(function(){

    var bgImages = ["#fff", "#f00", "#000", "#f0f", "#ccc", "#ddd", "#eee", "#bbb"];
    var bgImage = bgImages[ix];
    if(ix<bgImages.length){
         ix++;
    }

    var image = bgImage;
    var element = document.getElementById('bgImage');
    element.style.background  = image; // IE fallback

});

$('#left').click(function(){

    var bgImages = ["#fff", "#f00", "#000", "#f0f", "#ccc", "#ddd", "#eee", "#bbb"];
    if(ix>0){
         ix--;
    }
    var bgImage = bgImages[ix];


    var image = bgImage;
    var element = document.getElementById('bgImage');
    element.style.background  = image; // IE fallback

});

DEMO

answered Dec 6, 2013 at 13:10

Anand Jha

10.8k6 gold badges28 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery loop through array and reverse

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related