Foros del Web » Programando para Internet » Javascript »

rotacion de imagenes en un boton

Estas en el tema de rotacion de imagenes en un boton en el foro de Javascript en Foros del Web. he estado buscando en las faq para resolver el problema pero no he podido hacerlo funcionar. soy bastante novatillo en esto, llevo un par de ...
  #1 (permalink)  
Antiguo 12/06/2005, 08:05
 
Fecha de Ingreso: octubre-2004
Mensajes: 46
Antigüedad: 19 años, 6 meses
Puntos: 0
rotacion de imagenes en un boton

he estado buscando en las faq para resolver el problema pero no he podido hacerlo funcionar. soy bastante novatillo en esto, llevo un par de semanas empapandome de manuales y tal, a ver si podeis darme algun consejo o link que me pueda ayudar.

en el siguiente codigo, intento colocar una imagen de una rueda al lado de un boton, cuando se situa el raton sobre la rueda deben cargarse varias imagenes sucesivas dando el efecto de que gira, sin embargo la realidad es otra, tanto en firefox como en IExp., me carga mov[0] pero no pasa nada cuando pongo el raton sobre la imagen.

<head>
<title>La web del invierno</title>
<link rel="STYLESHEET" type="text/css" href="estilo.css">
</head>

<script language=javascript>
mov = new Array()
mov[0] = new Image(48,46)
mov[0].src = "./images/rueda0.gif"
mov[1] = new Image(48,46)
mov[1].src = "./images/rueda1.gif"
mov[2] = new Image(48,46)
mov[2].src = "./images/rueda2.gif"
mov[3] = new Image(48,46)
mov[3].src = "./images/rueda3.gif"

function mov(){
var i
for(i=0;i<4;i++){
window.document.getElementById('rueda').src = mov[i].src
}
}
function stop(){
window.document.getElementById('rueda').src = mov[0].src
}
</script>


<div id="borde">
<div id="contenedor">

<div id="cabecera"><img src="images/cabeceramsport.jpg" width="700" height="106" alt="La Web del Invierno" border="0"></div>

<div id="navegador">
<a href="#" class="enlacenav" onmouseover="mov()" onmouseout="stop()"><img src="./images/rueda0.gif" width=48 height=46 alt="rueda" border="0" id="rueda">Portada</a> |
<a href="#" class="enlacenav">Invierno</a> |
<a href="#" class="enlacenav">Diciembre a marzo</a> |
<a href="#" class="enlacenav">La chimenea</a> |

me han comentado que puede ser por que se hace el cambio de imagen tan rapido que no se llega a apreciar, pero no se como solucionarlo, aunque yo me inclino por pensar que mi novatez me ha hecho poner algo de codigo fuera de sitio, algunas comillas mal o incluso puede faltar codigo para cumplir la funcion.
gracias de antemano.
__________________
:adios: Saludos
Dokan
  #2 (permalink)  
Antiguo 12/06/2005, 08:21
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Hola:

Sin duda es lo que te han dicho... te recomiendo que busques un rotador de imágenes (creo que puedes encontrar algo en las páginas de Carlitos o tunait... www.carlitos.com.es o javascript.tunait.com ) y lo pones entre tag button o como tu ejemplo en un tag a.

La forma que usas no te la recomiendo, si piensas desarrollarlo tu mismo, pon un retardo entre las imágenes (setTimeout)

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 12/06/2005, 08:25
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 22 años, 2 meses
Puntos: 772
Hola Dokan

Veo que se me ha adelantado caricatos (¡Hola! ), pero como ya había estado trasteando un poco con tu código, te lo dejo aquí un poco corregido. He cambiado también nombre de la función en lugar de mov() lo he llamado mover() por si se liaba con el nombre de la variable:
Código PHP:
var i=0;
function 
mover(){
i++;
if (
i>3i=0;
window.document.getElementById('rueda').src mov[i].src
setTimeout
('mover()',500);

Saludos,
  #4 (permalink)  
Antiguo 13/06/2005, 11:10
 
Fecha de Ingreso: octubre-2004
Mensajes: 46
Antigüedad: 19 años, 6 meses
Puntos: 0
gracias a ambos por responder, con este codigo si que ha funcionado, aunque tengo que trabajar mas en las imagenes que no salen muy bien, pero por lo menos el codigo funciona
un saludo
__________________
:adios: Saludos
Dokan
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 00:46.