JavaScript - Menu Javascript ayuda

 
Vista:
Imágen de perfil de Augusto
Val: 1
Ha disminuido su posición en 147 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Menu Javascript ayuda

Publicado por Augusto (1 intervención) el 09/10/2019 14:49:12
Buenas...
Soy bastante principiante con el Javascript pero aprendo rápido y me vendría bien un poco de ayuda.
Necesito hacer un botón de imagen que al pasar el cursor por encima muestre una secuencia de 40 imágenes y haga un bucle y que al hacer click pase a una secuencia de las siguientes 20 imágenes antes de abrir el enlace.
Les muestro el código que tengo hasta ahora y estoy peleando para que detecte el mouse para hacer la secuencia pero no logro conseguirlo.
Si alguien me ayuda con el diseño del boton puedo devolver el favor si es necesario con diseño gráfico o 3D
Desde ya muchas gracias. Saludos

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<head>
<script>
 
    /**
     * Array con las imagenes y enlaces que se iran mostrando en la web
     */
    var imagenes=new Array(
        ['img/1botoninicio0000.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0001.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0002.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0003.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0004.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0005.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0006.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0007.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0008.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0009.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0010.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0011.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0012.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0013.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0014.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0015.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0016.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0017.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0018.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0019.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0020.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0021.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0022.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0023.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0024.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0025.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0026.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0027.png','https://augusto-3d.blogspot.com/#'],
		['img/1botoninicio0028.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0029.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0030.png','https://augusto-3d.blogspot.com/#'],
        ['img/1botoninicio0031.png','https://augusto-3d.blogspot.com/#'],
    );
    var contador=0;
 
    /**
     * Funcion para cambiar la imagen y link
     */
    function rotarImagenes()
    {
	rotarImagenesimagenes.addEventListener('mouseover', Imagenes, false);
        // cambiamos la imagen y la url
        contador++
        document.getElementById("imagen").src=imagenes[contador%imagenes.length][0];
        document.getElementById("link").href=imagenes[contador%imagenes.length][1];
    }
 
    /**
     * Función que se ejecuta una vez cargada la página
     */
    onload=function()
    {
        // Cargamos una imagen aleatoria
        rotarImagenes();
 
        // Indicamos que cada 5 segundos cambie la imagen
        setInterval(rotarImagenes,240);
    }
</script>
</head>
 
<body>
 
<a href="" id="link"><img src="" id="imagen"></a>
 
</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Alejandro
Val: 1.333
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Menu Javascript ayuda

Publicado por Alejandro (289 intervenciones) el 09/10/2019 15:52:16
La pagina al cargar ejecuta la linea 62 rotarImagenes()
rotarImagenes() crea un listener al elemento "rotarImagenesimagenes" el cual no veo en ningún lado.
el listener del elemento inexistente al pasar el mouse encima ejecuta la función "Imagenes" que tampoco la veo declarada en ninguna parte.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar