Buenas tengo un script de mouseover que debería aplicarse sobre varios elementos y solo funciona sobre el último y no se el motivo.
<script>
function giraImagen() {
var imagenes = document.getElementsByClassName("flecha1");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(270deg)";
}
}
function vuelveImagen() {
var imagenes = document.getElementsByClassName("flecha1");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(0deg)";
}
}
function giraImagen() {
var imagenes = document.getElementsByClassName("flecha2");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(270deg)";
}
}
function vuelveImagen() {
var imagenes = document.getElementsByClassName("flecha2");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(0deg)";
}
}
function giraImagen() {
var imagenes = document.getElementsByClassName("flecha3");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(270deg)";
}
}
function vuelveImagen() {
var imagenes = document.getElementsByClassName("flecha4");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(0deg)";
}
}
function giraImagen() {
var imagenes = document.getElementsByClassName("flecha5");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(270deg)";
}
}
function vuelveImagen() {
var imagenes = document.getElementsByClassName("flecha5");
for (var i = 0; i < imagenes.length; i++) {
imagenes[i].style.transform = "rotate(0deg)";
}
}
</script>
He repetido el script una vez por cada imagen que quiero rotar pero solo se aplica sobre la ultima
he repetido el script todas las veces porque quiero que funcione como un hover al pasar el raton por encima si escribia todo bajo la misma clase me rotaba todas las imagenes a la vez.
Gracias de antemano!