Simple script doesn't run

Question

I have five images in a folder of my computer and I'm trying to create a script that display an image on the screen and when I click a button the image changes.

The JavaScript code:

function cambiaimagen()
{
var i=1;
var direcciones = new            
    Array("imagen1.jpg","imagen2.jpg","imagen3.jpg","imagen4.jpg","imagen5.jpg");
var vusr = document.getElementById('imgs').value;
document.getElementById('imgs').innerHTML = vusr;
}

The HTML code:

<div id="contenedor">

<div id="img">
<img id="imgs" src="imagen1.jpg"/>
</div>

<button type="button">Anterior</button>
<button type="button" onclick = 'cambiaimagen()'>Siguiente</button>

</div>

When I run the script I watch the image 1 and the buttons. But when I click Siguiente button I don't watch the following image of array direcciones.

How can I watch it?

Hope4You · Accepted Answer · 2013-07-31 18:32:40Z

1

Replace your previous JavaScript code with this:

var cnt = 1;
var direcciones = new Array("imagen1.jpg","imagen2.jpg","imagen3.jpg","imagen4.jpg","imagen5.jpg");
function cambiaimagen(){
    if(cnt != direcciones.length - 1){
        cnt++;
    }else{
        cnt = 1;
    }
    document.getElementById('imgs').src = direcciones[cnt];
}

If the image names are in sequential number order (as they are in your example), you could use the following instead:

var cnt = 1;
var imgCnt = 5;
function cambiaimagen(){
    if(cnt != imgCnt){
        cnt++;
    }else{
        cnt = 1;
    }
    document.getElementById('imgs').src = "imagen" + cnt + "2.jpg";
}

Which I believe is a better method because there is no array with repetitive contents.

edited Jul 31, 2013 at 18:32

answered Jul 31, 2013 at 18:08

Hope4You

1,9634 gold badges22 silver badges45 bronze badges

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

2 Comments

axmug Over a year ago

I'm using Firefox and there are no JavaScript errors. Wnen I run the script I only watch the image and the buttons. When I click one button the image doesn't change.

axmug Over a year ago

Yes. Now it works. I was typed the code wrongly. Thanks for the answer.

Samuel Reid · Accepted Answer · 2013-07-31 18:09:59Z

1

var direcciones = ["imagen1.jpg","imagen2.jpg","imagen3.jpg","imagen4.jpg","imagen5.jpg"];
var cnt = 0;
function cambiaimagen(){
document.getElementById("imgs").src = direcciones[(++cnt)%direcciones.length];
}

answered Jul 31, 2013 at 18:09

Samuel Reid

1,7761 gold badge12 silver badges23 bronze badges

2 Comments

Jacob Morrison Over a year ago

You should probably explain what you're doing, rather than just post code.

Samuel Reid Over a year ago

I think it's just one more way of doing the answer anyone else would give.

Collectives™ on Stack Overflow

Simple script doesn't run

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related