ayuda con una porcion de codigo por favor esta sencillo

andresbetancourt · #1 (**permalink**) 04/12/2008, 21:50

hola a todos espero esten bien

tengo un problema

dentro de mi pagina tengo un codigo javascript el cual se encarga de cambiar imagenes y los link para que sea como una animacion en la cual el usuario si desea pueda dar clic en la imagen y pueda ir a otro sitio asi:

<script language="javascript">

var numero=1;

setTimeout("cambio()",2000);

function cambio(){

if(numero == 1){

vinculo.href="http://tiesto.com";
img.src="imagenes/tiesto.png";

numero = 2;

setTimeout("cambio()",2000);

}

else{

if(numero == 2){

img.src="imagenes/crazy.png";

vinculo.href="http://www.hi5.com/friend/p174583007--Dj%20CrAzY%20%20%20%20ThE%20BeSt%20--html";

numero = 3;

setTimeout("cambio()",2000);

}

else{

if(numero == 3){

img.src="imagenes/davidguetta.png";

vinculo.href="http://www.davidguetta.com/en/news";

numero = 4;

setTimeout("cambio()",2000);

}

else{

if(numero == 4){

img.src="imagenes/paulvandyk.png";

vinculo.href="http://www.paulvandyk.com/index.aspx";

numero = 5;

setTimeout("cambio()",2000);

}

else{

if(numero == 5){

img.src="imagenes/basshunter.png";

vinculo.href="http://www.basshunter.eu";

numero = 6;

setTimeout("cambio()",2000);

}

else{

img.src="imagenes/armin.png";

vinculo.href="http://www.arminvanbuuren.com";

numero = 1;

setTimeout("cambio()",2000);

}

}

}

}

}

}

</script>

y mas abajo tengo una imagen y un vinculo asi dentro del cuerpo del documento
html, que es donde la imagen va cambiando y el link tambien

<div id="celda4fila3" style="height: 1500px"><a name="vinculo" target="_blank" href="http://www.arminvanbuuren.com"><img name="img" width="150px" height="150px" src="imagenes/armin.png" /></a></div>

el problema es:

cuando pongo esto a correr, me sale la primer imagen, luego salta a la segunda despues de los 2000 milisegundos que le defini como tiempo de espera, y no hace mas nada, no se que sucede, le cambien de orden las instrucciones, es decir primero que cambie el link y luego la imagen, y me paso que no cambio la imagen entonces creo que solo esta ejecutando la primer instruccion, osea entra el if y entra cuando numero == 1 luego ejecuta la primer instruccion de cambiar la imagen y listo no hace mas, ¿que sera que esta pasando?, por mas que le busco no le veo problema al codigo me parece que esta bien programado ademas es demasiado simples.

ojala me puedan ayudar

David · #2 (**permalink**) 04/12/2008, 22:00

¿Qué tal simplificar y hacer más legible el código? Para eso puedes usar un array:

Código javascript:

Ver originalvar actual=0;
var enlaces = ["http://www.google.com/", "http://www.forosdelweb.com/", "http://www.maestrosdelweb.com/"];
var imagenes = ["google.jpg", "forosdelweb.jpg", "maestrosdelweb.jpg"];

Eso sería un ejemplo, y el código de la función cambio se reduciría así:

Código javascript:

Ver originalimg.src = imagenes[actual];
enlace.href = enlaces[actual];
actual++;
if (!actual < enlaces.length) actual=0;
setTimeout(cambio, 2000);

Fíjate que todo se vuelve más fácil, puedes añadir y quitar enlaces sin ningún problema del array. Saludos

.

andresbetancourt · #3 (**permalink**) 05/12/2008, 08:13

Cita:

Iniciado por David el Grande

¿Qué tal simplificar y hacer más legible el código? Para eso puedes usar un array:

Código javascript:

Ver originalvar actual=0;
var enlaces = ["http://www.google.com/", "http://www.forosdelweb.com/", "http://www.maestrosdelweb.com/"];
var imagenes = ["google.jpg", "forosdelweb.jpg", "maestrosdelweb.jpg"];

Eso sería un ejemplo, y el código de la función cambio se reduciría así:

Código javascript:

Ver originalimg.src = imagenes[actual];
enlace.href = enlaces[actual];
actual++;
if (!actual < enlaces.length) actual=0;
setTimeout(cambio, 2000);

Fíjate que todo se vuelve más fácil, puedes añadir y quitar enlaces sin ningún problema del array. Saludos

.

ufff si claro asi es mas facil, gracias voy a probar a ver si me funciona y luego te cuento gracias

chao

andresbetancourt · #4 (**permalink**) 05/12/2008, 08:29

holaaa David el grande

ya lo coloque y no me funciono

mira el codigo quedo asi:

Código:

<script language="javascript">

		   
      var actual=0;
   
      var enlaces = ["http://www.arminvanbuuren.com", "http://tiesto.com", "http://www.hi5.com/friend/p174583007--Dj%20CrAzY%20%20%20%20ThE%20BeSt%20--html", "http://www.davidguetta.com/en/news", "http://www.paulvandyk.com/index.aspx", "http://www.basshunter.eu"];
   
      var imagenes = ["imagenes/armin.png", "imagenes/tiesto.png", "imagenes/crazy.png", "imagenes/davidguetta.png", "imagenes/paulvandyk.png", "imagenes/basshunter.png"];

 

		function cambio(){		
			   
     		imagen.src = imagenes[actual];
   
      		vinculo.href = enlaces[actual];
   
      		actual = actual + 1;
   
      		if (!actual < enlaces.length) actual=0;
   
      			setTimeout(cambio, 2000);						
				
		}

</script>




y dentro del body hay algo como esto:




<div id="celda4fila3" style="height: 1500px">
     
        <a name="vinculo" target="_blank" href="http://www.arminvanbuuren.com">

                <img name="imagen" width="150px" height="150px" src="imagenes/armin.png" />

        </a>

</div>

que podra ser, ahora nisiquiera pasa de la primer imagen abro la pagina y se queda sin animacion solo muestra la primer imagen y ya.

antes si funcionaba pero es que antes no habia agregado la parte de los enlaces, tan solo agregue la parte de los enlaces y dejo de funcionar,

antes era el mismo codigo, solo que ahora le agregue la parte de los enlaces, claro que el codigo del que hablo es el primero que postee,

porque con este ultimo no me mueve ni a la segunda imagen y lo mas raro es que se ve bien el codigo, no esta mal programado a mi

parecer.

bueno gracias ojala me puedan ayudar

David · #5 (**permalink**) 05/12/2008, 08:55

Dos cosas, ¿estás ejecutando la función cambio en el evento onload de la página? Porque debes hacerlo. Segundo, no hagas referencia así directamente a los elementos por su name, mejor asígnales un id y obtienes la referencia con document.getElementById('id_del_elemento'). Otra cosa, ¿has mirado la Consola de Errores de tu navegador?

andresbetancourt · #6 (**permalink**) 05/12/2008, 10:24

hola

umm mira que cuando empece a programar esta animacion si hice uso de la funcion onload pero no me funciono luego sela quite y ahi si me funciono por eso no la coloquemas
en cuanto a lo demas
no no lo he hecho nada de lo que me dices
voy a hacerlo

¿este como hago para ver la consula de errores del navegador?

gracias por tu ayuda de verdad muchas gracias por tu interes en ayudarme

chao

David · #7 (**permalink**) 05/12/2008, 10:32

Lo de la Consola de Errores depende del navegador que uses. En Firefox sería Herramientas > Consola de Errores. En Internet Explorer normalmente cuando ocurre un error aparece un ícono de advertencia en la ezquina inferior izquierda, haciendo doble click sobre él muestra una pequeña descripción del error.

andresbetancourt · #8 (**permalink**) 05/12/2008, 11:01

hola david el grande

mira ya hice lo que me indicaste

y me pasa esto:

en firefox nunca termina de cargar la pagina

y en internet me arroja una ventanita donde dice

"Stack overflow at line: 0"

parce ser que se desborda hay un sobre flujo

yo creo qu es por la funcion onLoad=cambio();

porque cuando la quito ya no me pasa eso, pero igual no se produce ninguna

animacion

yo pongo dicha funcion en esta parte:

<div id="celda4fila3" style="height: 1500px">

<a id="vinculo" target="_blank" href="http://www.arminvanbuuren.com">

<img id="imagen" width="150px" height="150px" src="imagenes/armin.png" onLoad=cambio(); />

</a>

</div>

¿esta bien en ese sitio o la debo colocar en otro lugar?

gracias

David · #9 (**permalink**) 05/12/2008, 11:04

No debe ir ahí, mejor coloca lo siguiente en tu código Javascript en el <head>

Código javascript:

Ver originalwindow.onload = cambio;

Saludos

.

andresbetancourt · #10 (**permalink**) 05/12/2008, 17:56

acabo de hacer lo que me indicaste jejeje uy que pena contigo de verdad

coloque esto

window.onload = cambio;

y luego la cambie por esto

window.onload = cambio();

aca:

<script language="javascript">

window.onload = cambio();

var actual=0;

var enlaces = ["http://www.arminvanbuuren.com", "http://tiesto.com", "http://www.hi5.com/friend/p174583007--Dj%20CrAzY%20%20%20%20ThE%20BeSt%20--html", "http://www.davidguetta.com/en/news", "http://www.paulvandyk.com/index.aspx", "http://www.basshunter.eu"];

var imagenes = ["imagenes/armin.png", "imagenes/tiesto.png", "imagenes/crazy.png", "imagenes/davidguetta.png", "imagenes/paulvandyk.png", "imagenes/basshunter.png"];

function cambio(){

var imagensita = document.getElementById('imagen');

var vinculito = document.getElementById('vinculo');

imagensita.src = imagenes[actual];

vinculito.href = enlaces[actual];

actual = actual + 1;

if (!actual < enlaces.length) actual=0;

setTimeout(cambio, 2000);

}

</script>

¿y adivina que? nooooooooo me funciono jejeje yo no se que pasa con este simple codiguito javaScript que no desea funcionar

gracias de todas formas si tienes otra solucion estoy dispuesto a recibirla

chao

David · #11 (**permalink**) 06/12/2008, 12:03

No debes poner cambio(), debe ser sólo cambio sin más. Además, ¿has colocado los id correcto a los elementos? ¿podrías poner tu código HTML? Nuevamente ¿has revisado la Consola de Errores de tu navegador?

andresbetancourt · #12 (**permalink**) 06/12/2008, 15:50

hola

que pena no habia podido responder porque estaba estudiando para un examen en la universidad

si ya hice todo lo que me indicaste, coloque cambio con y sin parentesis, y aun asi no me funciona esta muy raro, mira aca te dejo el codigo, no es muy complicado, son mas que todo imagenes y texto

Código:

<html>



<head>



<title>Rumbas Electronicas</title>



	

<script language="javascript">

		

	  window.onload = cambio;

		   

      var actual=0;

   

      var enlaces = ["http://www.arminvanbuuren.com", "http://tiesto.com", "http://www.hi5.com/friend/p174583007--Dj%20CrAzY%20%20%20%20ThE%20BeSt%20--html", "http://www.davidguetta.com/en/news", "http://www.paulvandyk.com/index.aspx", "http://www.basshunter.eu"];

   

      var imagenes = ["imagenes/armin.png", "imagenes/tiesto.png", "imagenes/crazy.png", "imagenes/davidguetta.png", "imagenes/paulvandyk.png", "imagenes/basshunter.png"];



 



		function cambio(){		

			   

			 var imagensita = document.getElementById('imagen');

			 

			 var vinculito = document.getElementById('vinculo');

			 

     		imagensita.src = imagenes[actual];

   

      		vinculito.href = enlaces[actual];

   

      		actual = actual + 1;

   

      		if (!actual < enlaces.length) actual=0;

   

      			setTimeout(cambio, 2000);						

				

		}



</script>











<link href="estilos/estilo.css" rel="stylesheet" type="text/css">







</head>





<body>



<center>



<div id="tabla">





	<div id="fila1">

		<div id="celda1fila1"></div>

		<div id="celda2fila1"></div>

		<div id="celda3fila1"></div>

	</div>

	

	

	<div id="fila2">

		<div id="celda1fila2"></div>

		<div id="celda2fila2"><img src="imagenes/tituloIndex.png"></div>

		<div id="celda3fila2"></div>

	</div>

	

	

	

	<div id="fila3">

		<div id="celda1fila3" style="height: 1500px"></div>

		<div id="celda2fila3" style="height: 1500px">

		

			<ul>

				<li>

				<a href="index.html">Home</a>

				</li>



				<li>				

				<a href="descargas.html">Descargas</a>

				</li>



				<li>

				<a href="anuncios.html">Anuncios</a>

				</li>



				<li>				

				<a href="eventos.html">Eventos y Parties</a>

				</li>



				<li>

				<a href="sitios.html">Sitios</a>

				</li>



				<li>

				<!-- bajo coloco esos simbolos raros para abrir y cerrar los signos de pregunta y otro para colocar la e con tilde -->

				<a href="musikElectronica.html">¿ Qu&eacute; es musik electronik ?</a>

				</li>

				

				<li>

				<!-- a continuacion agrego un simbolo raro para la e con tilde -->

				<a href="mejoresDj.html">Mejores 100 DJs seg&uacute;n Mag</a>

				</li>



				<li>

				<a href="talentoLocal.html">Talento Local</a>

				</li>



				<li>

				<a href="chat.html">Chat</a>

				</li>



				<li>

				<a href="contactanos.html">Contactanos</a>

				</li>

			</ul>

		

			<br><br><br>



			<!-- BEGIN CBOX - www.cbox.ws - v001 -->

<div id="cboxdiv" style="text-align: center; line-height: 0">

<div><iframe frameborder="0" width="200" height="305" src="http://www5.cbox.ws/box/?boxid=320057&amp;boxtag=3154&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#FFFFFF 1px solid;" id="cboxmain"></iframe></div>

<div><iframe frameborder="0" width="200" height="75" src="http://www5.cbox.ws/box/?boxid=320057&amp;boxtag=3154&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#FFFFFF 1px solid;border-top:0px" id="cboxform"></iframe></div>

</div>

			<!-- END CBOX -->

			

		

		</div>

		

		<div id="celda3fila3" style="height: 1500px">

		

		

			<p align="left">

			En este sitio podras informate de las principales rumbas electronicas de la ciudad Buga y sus alrededores. 

			<br>

			Esperamos que te sirva de ayuda y gracias por visitarlo ;) 

			

		

			<br /><br /><br />





			<!-- a continuacion colo el codigo para que dejen comentarios en mi pagina, lo consegui en iespan.es, donde tengo mi dominio ahi me lo dan gratis -->



			<b><a href='http://tools.iespana.es/livredor/?log=partybuga&id=5741363'>DEJA TU COMENTARIO AQU&Iacute;</a></b>



			

			<br /><br /><br />





			<!-- a continuacion habia agregado, pero ya lo quite, un sonido este codigo es generado por esas paginas que te dejan crear listas de reproduccion-->



			









			   



			<br /><br /><br />

			

			<!-- inserto unos videos a continuacion -->



			<object width="300" height="300"><param name="movie" value="http://www.youtube.com/v/Yt-KMPvgKPo&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/v/Yt-KMPvgKPo&hl=en&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="300" height="300"></embed></object>





			<br />



			<a href="http://www.4shared.com/file/67670806/d13b7efc/No_Mercy_-_Where_do_you_go.html">Descargalo</a>







			<br /><br /><br />





			<object width="300" height="300"><param name="movie" value="http://www.youtube.com/v/Pyly3JtXoy4&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/v/Pyly3JtXoy4&hl=en&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="300" height="300"></embed></object>



			

			<br /



			<a href="http://www.4shared.com/file/67671422/55c64666/it_is_beautifull_live.html">Descargalo</a>





			<br /><br />



			<!-- a continuacion colo el codigo para que dejen comentarios en mi pagina, lo consegui en iespan.es, donde tengo mi dominio ahi me lo dan gratis -->



			<b><a href='http://tools.iespana.es/livredor/?log=partybuga&id=5741363'>DEJA TU COMENTARIO AQU&Iacute;</a></b>

			

			</p>



			

		

			

		

		

		</div>



		<div id="celda4fila3" style="height: 1500px"><a id="vinculo" target="_blank" href="http://www.arminvanbuuren.com"><img id="imagen" width="150px" height="150px" src="imagenes/armin.png" /></a></div>



		<div id="celda5fila3" style="height: 1500px"></div>

	</div>

	

	

	<div id="fila4">

	

		<div id="celda1fila4"></div>

		<div id="celda2fila4"></div>

		<div id="celda3fila4"></div>

	

	</div>







</div>



</center>





</body>

</html>

muchas gracias ojalá me puedas ayudar

chao

David · #13 (**permalink**) 06/12/2008, 21:21

Cambia la línea del if por esta:

Código javascript:

Ver originalif (actual==enlaces.length) actual=0;

andresbetancourt · #14 (**permalink**) 07/12/2008, 08:06

ahhhh sos un duro un buenagente nunca me dejaste solo ni te cansaste de responderme

muuuchas graciaaaasss ya funcionooooooooooooooooooo

graciaaaaaaaassss MUUUCHAS GRACIAS GRACIAS DE VERDAD POR TU INTERES EN AYUDAR A PERSONAS COMO YO DE MANERA DESINTERESADA

MUUUCHAS GRACCIIIASSS David el Grande sos rebien

chao y que estes re bien

SALUDOS

andresbetancourt · #15 (**permalink**) 07/12/2008, 08:15

ufff que pena una ultima pregunta

¿por qué con < no funciono y con == si, si la longitud del arreglo es un numero?

muchas gracias saludos

David · #16 (**permalink**) 07/12/2008, 21:06

Es que para que funcionara debería ser:

Código javascript:

Ver originalif (!(actual < enlaces.length)) actual=0;

andresbetancourt · #17 (**permalink**) 08/12/2008, 12:58

umm ya veo

muchas gracias

de verdad muchas gracias

que estes bien

chao