Mostrar Mensajes
21
C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Crear slider imágenes JavaScript document.getElementById src alt title CU01127E
« en: 27 de Noviembre 2015, 22:38 »
Hola, quiero comprobar si mis respuestas al ejercicio CU01127E del tutorial son correctas.
1 - El código funciona correctamente.
2 - Lo que ocurre al poner la variable (numeroImagenActual = 9) dentro de la funcion es que siempre que la llamemos se asigna la variable a 9, entonces las condiciones (if numeroImagenActual == 11) e (if numeroImagenActual == 6) nunca se cumplen, entonces el código no funciona correctamente.
3 - El código modificado es el siguiente.
4 - Cuando duplicamos el código solo se cambia la imagen de arriba, porque JavaScript devuelve los primeros elementos con los atributos ID que encuentra.
Muchas gracias a todos.
1 - El código funciona correctamente.
2 - Lo que ocurre al poner la variable (numeroImagenActual = 9) dentro de la funcion es que siempre que la llamemos se asigna la variable a 9, entonces las condiciones (if numeroImagenActual == 11) e (if numeroImagenActual == 6) nunca se cumplen, entonces el código no funciona correctamente.
3 - El código modificado es el siguiente.
Código: [Seleccionar]
<html><head><title>Curso JavaScript aprenderaprogramar.com</title>
<meta charset="utf-8">
<style type="text/css">
body {text-align: center; font-family: sans-serif;}
div {margin:20px;}
#contenedor {width:405px;margin:auto;}
#adelante, #atras {padding:15px; width: 130px; float: left;
color: white; border-radius: 40px; background: rgb(202, 60, 60);}
#adelante:hover, #atras:hover {background: rgb(66, 184, 221);}
</style>
<script type="text/javascript">
function moverImagen(movimiento) {
var numeroImagenActual = 9;
var carousel, valorSrc = [], valorAlt = [], valorTitle = [];
carousel = document.getElementById('imgCarrusel');
valorSrc[0] = 'http://aprenderaprogramar.com/images/thumbs_portada/thumbs_camisetas/camiseta_9_humor_informatico_foto.jpg';
valorSrc[1] = 'http://aprenderaprogramar.com/images/thumbs_portada/thumbs_camisetas/camiseta_6_humor_informatico_foto.jpg';
valorSrc[2] = 'http://aprenderaprogramar.com/images/thumbs_portada/thumbs_camisetas/camiseta_11_humor_informatico_foto.jpg';
valorAlt[0] = 'Camiseta 9 aprenderaprogramar.com';
valorAlt[1] = 'Camiseta 6 aprenderaprogramar.com';
valorAlt[2] = 'Camiseta 11 aprenderaprogramar.com';
valorTitle[0] = 'Diálogo entre informáticos';
valorTitle[1] = 'Desbordado por los números';
valorTitle[2] ='Estudiando programacion';
if (numeroImagenActual == 6 && movimiento == 'atras' || numeroImagenActual == 11 && movimiento == 'adelante') {
alert ('No es posible hacer ese movimiento');
}
if (numeroImagenActual == 11 && movimiento == 'atras' || numeroImagenActual == 6 && movimiento =='adelante') {
valorNuevoNumeroImagen = 9;
carousel.src = valorSrc[0];
carousel.alt = valorAlt[0];
carousel.title = valorTitle[0];
}
if (numeroImagenActual == 9 && movimiento == 'atras') {
valorNuevoNumeroImagen = 6;
carousel.src = valorSrc[1];
carousel.alt = valorAlt[1];
carousel.title = valorTitle[1];
document.getElementById('numeracion').nodeValue = '99';
}
if (numeroImagenActual == 9 && movimiento == 'adelante') {
valorNuevoNumeroImagen = 11;
carousel.src = valorSrc[2];
carousel.alt = valorAlt[2];
carousel.title = valorTitle[2];
}
numeroImagenActual = valorNuevoNumeroImagen;
document.getElementById('numeracion').firstChild.nodeValue = 'Camiseta ' + numeroImagenActual;
}
</script>
</head>
<body>
<div >
<p>Pulsa adelante o atrás</p>
<h1 id="numeracion">Camiseta 9</h1>
<img id="imgCarrusel" src="http://aprenderaprogramar.com/images/thumbs_portada/thumbs_camisetas/camiseta_9_humor_informatico_foto.jpg" alt="Camiseta 9 aprenderaprogramar.com" title="Diálogo entre informáticos">
<div id="contenedor">
<div id ="atras" onclick="moverImagen('atras')"> <<< Atrás </div>
<div id="adelante" onclick="moverImagen('adelante')" >Adelante >>></div>
</div>
</div>
</body>
</html>
4 - Cuando duplicamos el código solo se cambia la imagen de arriba, porque JavaScript devuelve los primeros elementos con los atributos ID que encuentra.
Muchas gracias a todos.
RSS