Carrusel Ayuda Porfavor

GidHarvey · #1 (**permalink**) 28/09/2009, 19:40

Buenas Noches Amigos de FDW.
bueno les queria consultar sobre un carrusel de imagenes para mi web, he buscado y buscado y no encuentro en ninguna parte un codigo o un tutorial, tambien eh buscado aqui, pero no se que nombres les ponen, aqui les dejo un ejemplo de lo que les digo yo y aqui pongo el dise~o de lo que yo necesito.

porfavor alguien que sea de buen corazon que me ayude.

ATTe Gidharvey

ejemplo:
http://osc.template-help.com/wt_25872/#

Imagen de lo que yo necesito:
http://img44.imageshack.us/img44/6431/carusel.jpg

crujikoki · #2 (**permalink**) 29/09/2009, 01:42

Hola,

Viendo lo que quieres hacer (por cierto, la web que pones de ejemplo me ha gustado mucho) quizás este post te sirve de algo, aun que no estoy seguro por que no se como lo queires hacer. Ahí lo monta con PHP y no se yo si es lo mejor...

Yo lo que te podría dar dos orientaciones, ya que yo tampoco lo he hecho nunca.

1. Podrías bajarte los scripts que usa la web y intentar ver como lo hacen ellos.

2. Si lo quieres hacer tú de zero, yo te aconsejaría que usaras un timer. Cada vez que saltara el evento de final del timer, cargas la nueva imagen y luego reinicias el timer. El concepto es muy sencillo y la forma de aplicar lo que te digo también.

Aquí tienes un post que contesté no hace mucho. No pide lo mismo pero así verás como puedes hacer el timer.

Sobre como hacer los estilos no te puedo ayudar mucho ya que no se me da muy bien, pero podríamos intentarlo también. Si no te aclaras con algo o crees que mi respuesta no se acerca en nada a l oque esperabas, por favor, vuelve a psotear y nos lo miramos más detalladamente.

Saludos.

GidHarvey · #3 (**permalink**) 29/09/2009, 13:04

Hola, no entendi mucho los otros post, pero si existe la posibilidad de sacar los codigos, de la pagina esa que puse donde sale el carrusel, me serviria ya que desde el codigo que tiene ese carrusel puedo hacer el mio creo yo, seria posible que alguien me diga cuales son los codigos del carrusel de la pagina que puse como ejemplo?? porfavor ayuda.

ATTe Gidharvey

PD: crujikoki muchas gracias amigo, te pasaste con tu respuesta, me oriento un poquitito pero me falta. saludos.

Adler · #4 (**permalink**) 29/09/2009, 13:19

Hola

Hay varios punto a favor y en contra de copiar los código de las web que visitamos. No voy a detallarlo por que ese no es el punto.
He estado viendo por encima el javascript de esa web y usa jquery. Creo que te llevaría mas tiempo entender el código para adaptarlo a lo que te ocupa que hacerlo desde cero.

Te dejo algo con lo que empezar

Código javascript:

Ver original<html>
<head>
<title>Rotador de banners</title>
 
<script language="JavaScript" type="text/JavaScript">
var url_vector = new Array(5);
var txt_vector = new Array(5);
var banner_vector = new Array(5);
var counter = 0;
var url = "";
 
url_vector[0] = "http://www.curso1.com";
url_vector[1] = "http://www.curso2.com";
url_vector[2] = "http://www.curso3.com";
url_vector[3] = "http://www.curso4.com";
url_vector[4] = "http://www.curso5.com";
 
 
 
txt_vector[0] = "Nivel muy bajo";
txt_vector[1] = "Vas subiendo de nivel";
txt_vector[2] = "Nivel intermedio";
txt_vector[3] = "Nivel avanzado";
txt_vector[4] = "Estas hecho un hacha";
 
 
 
if(document.images){
  for(i = 0; i < 5; i++)
  {
    banner_vector[i] = new Image(62,12);
    banner_vector[i] = "iconos/" + (i+1) + ".gif";
  }
}
 
 
function changeBanner(){
    if(counter > 4)
      counter = 0;
document.getElementById("banner").innerHTML = "<img src="+banner_vector[counter]+" width='62px' height='12px' title="+txt_vector[counter]+" border='0px' />"
url = url_vector[counter];
document.getElementById("texto").innerHTML = txt_vector[counter];
document.getElementById("banner_peq_5").style.background="white";
document.getElementById("banner_peq_"+(counter+1)).style.background="red";
    if (counter >= 1)
document.getElementById("banner_peq_"+counter).style.background="white";     
      counter++;
    }
 
 
timer = setInterval("changeBanner()", 2000);
window.onload = changeBanner;
 
</script>
</HEAD>
<body>
<a href="#" onClick="window.open(url,'BannerWin');">
<div id="banner"></div>
</a>
 
<div id="texto"></div>
 
<table border="1">
<tr>
 
<td id="banner_peq_1">
<img src="iconos/1.gif" />
</td>
<td id="banner_peq_2">
<img src="iconos/2.gif" />
</td>
<td id="banner_peq_3">
<img src="iconos/3.gif" />
</td>
<td id="banner_peq_4">
<img src="iconos/4.gif" />
</td>
<td id="banner_peq_5">
<img src="iconos/5.gif" />
</td>
</tr>
 
</table>
</body>
</html>

Suerte

GidHarvey · #5 (**permalink**) 30/09/2009, 08:23

Muchas gracias amigo, me servio mucho, no se como dar karma, pero muchas gracias de verdad se agradece mucho, saludos.