estoy intentando hacer esto:
- con 4 imagenes, que al pulsar sobre cualquiera de las imágenes se cambien de posición de manera secuencial todas, es decir, que en primer lugar se muestra la segunda imagen, en segundo lugar la tercera imagen, en tercer lugar la cuarta imagen y en último lugar la primera imagen. Y así cada vez que se pulse sobre ellas.
estoy intentando con un ciclo for, pero nada, no se como aplicarlo a cada imagen.
<img id='imagen1' src="img/1.jpg" alt="imagen muestra 1" onclick="rotarImagen()"><br>
<img id='imagen2' src="img/2.jpg" alt="imagen muestra 2" onclick="rotarImagen()"><br>
<img id='imagen3' src="img/3.jpg" alt="imagen muestra 3" onclick="rotarImagen()"><br>
<img id='imagen4' src="img/4.jpg" alt="imagen muestra 4" onclick="rotarImagen()">
<div id="imagenes"></div>
<script>
function rotarImagen() {
let ilista = document.getElementsByTagName('img');
for (let i = 0; i < ilista.length; i++) {
document.getElementById('imagen1').src = 'img/'+i+'.jpg';
document.getElementById('imagen2').src = 'img/'+i+'.jpg';
document.getElementById('imagen3').src = 'img/'+i+'.jpg';
document.getElementById('imagen4').src = 'img/'+i+'.jpg';
}
}
</script>