efecto galeria imagenes onmouseover

[danneg]

Hola, pues el mismo codigo que esta arriba te funciona perfectamente.

Te recuerdo que jQuery utiliza los mismos selectores que usa CSS, así que cuando llamas #imagen, esta obviamente llama a la imagen con id imagen (recuerda que el id es unico, si necesitas mas imágenes con este efecto, utiliza class. ej .imagen).

Código Javascript:

var cambiar = function(images){ //En el parametro se pasan las imagenes que mostrara
    var counter = 0; //Indica que inicia desde la primera imagen
    setTimeout(function() { //Inicia un temporizador
        $('#imagen').attr('src', images[counter]); //cambia la imagen segun el valor de counter
        counter++; //Suma uno a counter para cambiar las imagenes
        if (counter == images.length) { //Si counter es mas grande al numero de imagenes que tienes...
         counter = 0; //Regresas a la primera
        }
    }, 1000); //Repetir esto cada 10 segundos
},
imgoriginal = $('#imagen').attr('src'); //Guarda imagen original
 
$('#imagen').hover( //Evento hover
    function(){ // Mouse en imagen
        var images = [ //Imagenes que se mosttraran
             "002-1.jpg",
             "003-1.jpg"
         ];
         cambiar(images);
    },
    function(){ // Mouse fuera de imagen
        clearTimeout(); // Cancela el setTimeout
        $('#imagen').attr('src', imgoriginal); //Regresa a imagen original
    }
);