Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » aumentar tamaño imagen con event listener

JavaScript - aumentar tamaño imagen con event listener

Volver
Nuevo Tema
<<>>
 
Vista:
Imágen de perfil de cesar
Val: 80
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

aumentar tamaño imagen con event listener

Publicado por cesar (36 intervenciones) el 12/12/2019 20:23:40
amigos buenas les traigo este codigo el problema es que no desencadena ningun evento o sea no hace nada al tratar de que imagen crezca
anexo imagen
espero su ayuda dios sabra agradecerles

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
<!DOCTYPE html>
 
<html lang="es">
 
<head>
<title>Html 5</title>
 
<script>
var imagen;
//function virgen2(){
 
alert('virgen del valle' );
 
}
 
//function dvirgen2(){
  function manejaflor(){
//document.getElementsBytagName("ing")[0].onclick="virgen2()";
 
//addeventlistener
//var imagen = document.getElementsBytagName("ing")[0];
//imagen.addeventlistener("click", tipovirgen, false);
imagen=document.getElementsBytagName("ing")[0];
imagen.addeventlistener("click", crecer, false);
imagen.addeventlistener("mouseout", menguar, false);
 
}
 
function crecer(){
 imagen.width =1225
 imagen.height =1225
 
 
}
 
function menguar(){
 imagen.width = 780
 imagen.height =960
 
 
}
 
//window.onload("dvirgen2")
window.onload = manejaflor;
</script>
 
 
</head>
<body>
 
        <p><img src= "img/virgen2.jpg"  onclick="virgen2()"></p>
 
        <img class="logo"src= "https://twitter.com/i/status/1204788840159989760">
 
 
</html>
</body>


virgen2
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 xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

aumentar tamaño imagen con event listener

Publicado por xve (2100 intervenciones) el 12/12/2019 21:33:22
Tal y como te he comentado en el chat, revisa la consola del navegador, ahi veras los errores.

Es muy recomendable tabular bien el código... si lo tabulas, veras algunos errores a simple vista.
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
Imágen de perfil de cesar
Val: 80
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

aumentar tamaño imagen con event listener

Publicado por cesar (36 intervenciones) el 12/12/2019 22:03:27
GRacias si
recomiendo quitar esta linea la ultima del codigo
como ven nada tiene que ver con el espero respuesta por la via de errores por consola para mi me es imposible apenas estoy comenzando js

<img class="logo"src= "https://twitter.com/i/status/1204788840159989760">
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
Imágen de perfil de cesar
Val: 80
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

CON UN VALIDADOR DE ERRORRES

Publicado por cesar (36 intervenciones) el 13/12/2019 17:59:41
Quedo en las mismas dice que faltan una cosas y ahi estan
fue toma do desde esta parte del codigo

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
var imagen;
function virgen(){
 
//alert('virgen del valle' );
 
}
 
//function dvirgen2(){
  function manejaflor(){
//document.getElementsBytagName("ing")[0].onclick="virgen2()";
 
//addeventlistener
//var imagen = document.getElementsBytagName("ing")[0];
//imagen.addeventlistener("click", tipovirgen, false);
imagen=document.getElementsBytagName("img")[0];
imagen.addeventlistener("click", crecer, false);
imagen.addeventlistener("mouseout", menguar, false);
 
}
 
function crecer(){
 imagen.width=500px
 imagen.height=500px
 
 
}
 
function menguar(){
 imagen.width =240px
 imagen.height =280px
 
 
}
 
 
window.onload = manejaflor;
</script>
 
 
</head>
<body>
 
 
        <p><img src= "img/virgen.jpg"  onclick="virgen()"></p>




1 2 18 Expected exactly one space between ')' and '{'.
function virgen(){
2 6 1 Missing 'use strict' statement.
}
3 9 3 Expected 'function' at column 1, not column 3.
function manejaflor(){
4 9 24 Expected exactly one space between ')' and '{'.
function manejaflor(){
5 15 1 Missing 'use strict' statement.
imagen=document.getElementsBytagName("img")[0];
6 15 7 Missing space between 'imagen' and '='.
imagen=document.getElementsBytagName("img")[0];
7 15 8 Missing space between '=' and 'document'.
imagen=document.getElementsBytagName("img")[0];
8 16 1 Expected 'imagen' at column 5, not column 1.
imagen.addeventlistener("click", crecer, false);
9 16 34 'crecer' was used before it was defined.
imagen.addeventlistener("click", crecer, false);
10 17 1 Expected 'imagen' at column 5, not column 1.
imagen.addeventlistener("mouseout", menguar, false);
11 17 37 'menguar' was used before it was defined.
imagen.addeventlistener("mouseout", menguar, false);
12 21 18 Expected exactly one space between ')' and '{'.
function crecer(){
13 22 2 Missing 'use strict' statement.
imagen.width =500
14 22 16 Missing space between '=' and '500'.
imagen.width =500
15 22 19 Expected ';' and instead saw 'imagen'.
imagen.width =500
16 23 2 Expected 'imagen' at column 5, not column 2.
imagen.height =500
17 23 17 Missing space between '=' and '500'.
imagen.height =500
18 24 1 Unexpected character '(space)'.
19 23 20 Expected ';' and instead saw '}'.
imagen.height =500
20 28 19 Expected exactly one space between ')' and '{'.
function menguar(){
21 29 2 Missing 'use strict' statement.
imagen.width = 240
22 29 20 Expected ';' and instead saw 'imagen'.
imagen.width = 240
23 30 2 Expected 'imagen' at column 5, not column 2.
imagen.height =280
24 30 17 Missing space between '=' and '280'.
imagen.height =280
25 31 1 Unexpected character '(space)'.
26 30 20 Expected ';' and instead saw '}'.
imagen.height =280
27 36 1 'window' was used before it was defined.
window.onload = manejaflor;
28 37 1 Expected '(end)' and instead saw '
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
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

CON UN VALIDADOR DE ERRORRES

Publicado por ScriptShow (692 intervenciones) el 15/12/2019 16:14:37
Saludos Cesar,

veamos un ejemplo compatible, adaptable...

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
<!DOCTYPE html>
<html lang="es">
<head>
<title>Html 5</title>
<script>
function manejaflor(){
var imagen=document.getElementsByTagName("img")[0];
imagen.onclick=function(){crecer(this)}
imagen.onmouseout=function(){menguar(this)}
}
 
function crecer(i){
i.style.width="480px";
i.style.height="560px";
}
 
function menguar(i){
i.style.width="240px";
i.style.height="280px";
}
window.onload=manejaflor;
</script>
</head>
<body>
<p><img src= "img/virgen.jpg" border="0"></p>
</body>
</html>

Versión simplificada del ejemplo....

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html lang="es">
<head>
<title>Html 5</title>
<script>
function manejaflor(){
var imagen=document.getElementsByTagName("img")[0];
imagen.onclick=function(){this.style.width="480px";this.style.height="560px"}
imagen.onmouseout=function(){this.style.width="240px";this.style.height="280px"}
}
 
window.onload=manejaflor;
</script>
</head>
<body>
<p><img src= "img/virgen.jpg" border="0"></p>
</body>
</html>

Espero sea útil.
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