Foros del Web » Programando para Internet » Javascript »

No entiendo que esta mal :S

 Estas en el tema de No entiendo que esta mal :S en el foro de Javascript en Foros del Web. Hola... lo que quiero hacer es una barra como esta, y las imagenes son a lo estilo corusel: El caso es que va de maravilla.. ...
  #1 (permalink)  
Antiguo 15/01/2013, 06:09
djkiku
Invitado
  
Mensajes: n/a
Puntos:
No entiendo que esta mal :S
Hola... lo que quiero hacer es una barra como esta, y las imagenes son a lo estilo corusel:



El caso es que va de maravilla.. el problema es que solo aparecen 16 imagenes de las 20 que hay.. y aqui dejo el codigo.. haber si alguien me puede echar una mano

Código HTML:
<html>
<head>
<title>Carousel de im&aacute;genes (marquesina horizontal)</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#fuera img{
	margin-left: 20px;
}
</style>
<script language="JavaScript" type="text/JavaScript">
/*****************************************************************************
Carousel de imágenes (marquesina horizontal). Script creado por Tunait! (18/8/2003) modificado el 25/12/2003.
Si quieres usar este script en tu sitio eres libre de hacerlo con la condición de que permanezcan intactas estas líneas, osea, los créditos.
No autorizo a publicar y ofrecer el código en sitios de script sin previa autorización
Si quieres publicarlo, por favor, contacta conmigo.
http://javascript.tunait.com/
[email protected] 
******************************************************************************/
var ancho = 712  // especifica la anchura a mostrar
var alto = 54 // especifica la altura a mostrar (alto de las imágenes)
var velo = 20 // velocidad 
var dis = 1 //cantidad de pixels que desplaza por movimiento

var imagenes = new Array()
imagenes[0] = new Image()
imagenes[0].src = "http://1.bp.blogspot.com/-_HDthiM90wQ/UPU-ohdQA2I/AAAAAAAAAVU/OgXO0YGpb4Q/s1600/marca-abogados-gratis.png" // ruta o nombre de imagen 
imagenes[0].a = "http://www.yahoo.es/" // link de la imagen
imagenes[0].target = "_blank" //target del link
imagenes[1] = new Image()
imagenes[1].src = "http://4.bp.blogspot.com/-RdXX8t_mqMk/UPU-ucDj-0I/AAAAAAAAAXM/lhNLUKQISuU/s1600/marca-sms-gratis.png"
imagenes[1].a = "http://www.tunait.com"
imagenes[1].target = "_self"
imagenes[2] = new Image()
imagenes[2].src = "http://3.bp.blogspot.com/-OIfZa5HKtLQ/UPU-vcw8-lI/AAAAAAAAAXs/JA_D7sMVFy4/s1600/marca-tv-online.png"
imagenes[2].a = ""
imagenes[2].target = "_blank"
imagenes[3] = new Image()
imagenes[3].src = "http://1.bp.blogspot.com/-Bj_U53-cXUo/UPU-qHVDkXI/AAAAAAAAAVw/gFPaXSP9zg4/s1600/marca-documentales.png"
imagenes[3].a = ""
imagenes[3].target = "_blank"
imagenes[4] = new Image()
imagenes[4].src = "http://4.bp.blogspot.com/-bL5lrT7PD3o/UPU-rfn3LLI/AAAAAAAAAWU/XN-nMoTWht8/s1600/marca-humor.png"
imagenes[4].a = ""
imagenes[4].target = "_blank"
imagenes[5] = new Image() 
imagenes[5].src = "http://1.bp.blogspot.com/-cO2kN1oe_Po/UPU-rja7ndI/AAAAAAAAAWY/6xzfN6TpiJw/s1600/marca-juegos-gratis.png"
imagenes[5].a = ""
imagenes[5].target = "_blank"
imagenes[6] = new Image()
imagenes[6].src = "http://2.bp.blogspot.com/-Pk5K_vRKTec/UPU-paFKe3I/AAAAAAAAAVg/5P9EMMkike0/s1600/marca-cursos-gratis.png"
imagenes[6].a = ""
imagenes[6].target = "_blank"
imagenes[7] = new Image()
imagenes[7].src = "http://3.bp.blogspot.com/-ObQkLaRZ_Sc/UPU-uhU8rsI/AAAAAAAAAXU/k-RJLB73zoE/s1600/marca-tiendas-online.png"
imagenes[7].a = ""
imagenes[7].target = "_blank"
imagenes[8] = new Image()
imagenes[8].src = "http://3.bp.blogspot.com/-YSqkhBymU_E/UPU-o7ZMfMI/AAAAAAAAAVY/sZ9lgoEJliw/s1600/marca-apostar-apuestas.png"
imagenes[8].a = ""
imagenes[8].target = "_blank"
imagenes[9] = new Image()
imagenes[9].src = "http://3.bp.blogspot.com/-zUVNLPJF7gw/UPU-u9CDbrI/AAAAAAAAAXY/xEgZtC_bGvk/s1600/marca-trabajo.png"
imagenes[9].a = ""
imagenes[9].target = "_blank"
imagenes[10] = new Image()
imagenes[10].src = "http://2.bp.blogspot.com/-WPQDlKapo9M/UPU-qsQZ6CI/AAAAAAAAAWA/NVrZHFV5zfo/s1600/marca-finanzas.png"
imagenes[10].a = ""
imagenes[10].target = "_blank"
imagenes[11] = new Image()
imagenes[11].src = "http://1.bp.blogspot.com/-zKOgCBIKcfw/UPU-shxmLcI/AAAAAAAAAWw/dTHCxf4xw1s/s1600/marca-noticias.png"
imagenes[11].a = ""
imagenes[11].target = "_blank"
imagenes[12] = new Image()
imagenes[12].src = "http://3.bp.blogspot.com/-8fbJNRtqWuo/UPU-qXwUVcI/AAAAAAAAAV4/T7TNzlOSoaA/s1600/marca-el-tiempo.png"
imagenes[12].a = ""
imagenes[12].target = "_blank"
imagenes[13] = new Image()
imagenes[13].src = "http://3.bp.blogspot.com/-h2hiI0pzwSM/UPU-tlZxlKI/AAAAAAAAAW4/sBjAr7p35Vc/s1600/marca-recetas.png"
imagenes[13].a = ""
imagenes[13].target = "_blank"
imagenes[14] = new Image()
imagenes[14].src = "http://4.bp.blogspot.com/-_gcLzAySxuI/UPU-o-th_lI/AAAAAAAAAVc/0Fydss7cyxc/s1600/marca-amor.png"
imagenes[14].a = ""
imagenes[14].target = "_blank"
imagenes[15] = new Image()
imagenes[15].src = "http://1.bp.blogspot.com/-JM7wNYpkBfk/UPU-t2mGzrI/AAAAAAAAAXE/zZFUNzWhE7Y/s1600/marca-segundamano.png"
imagenes[15].a = ""
imagenes[15].target = "_blank"
imagenes[16] = new Image()
imagenes[16].src = "http://4.bp.blogspot.com/-FYTXIFKpfUA/UPU-wduygbI/AAAAAAAAAXw/S3PqZS9jnNI/s1600/marca-vuelos-baratos.png"
imagenes[16].a = ""
imagenes[16].target = "_blank"
imagenes[17] = new Image()
imagenes[17].src = "http://1.bp.blogspot.com/-zKOgCBIKcfw/UPU-shxmLcI/AAAAAAAAAWw/dTHCxf4xw1s/s1600/marca-noticias.png"
imagenes[17].a = ""
imagenes[17].target = "_blank"
imagenes[18] = new Image()
imagenes[18].src = "http://4.bp.blogspot.com/-QN_TyKQhjJo/UPU-rGc1zjI/AAAAAAAAAWI/Jb8A7nKdZjE/s1600/marca-horoscopo-tarot-gratis.png"
imagenes[18].a = ""
imagenes[18].target = "_blank"
imagenes[19] = new Image()
imagenes[19].src = "http://3.bp.blogspot.com/-qlpSadq2ets/UPU-tc5YR6I/AAAAAAAAAW8/KEmIYzMWJe0/s1600/marca-pagina-web-gratis.png"
imagenes[19].a = ""
imagenes[19].target = "_blank"
imagenes[20] = new Image()
imagenes[20].src = "http://3.bp.blogspot.com/-CB-9QZ0s2wg/UPU-pk2_c6I/AAAAAAAAAVo/Wd8-PFaPa70/s1600/marca-desahucios.png"
imagenes[20].a = ""
imagenes[20].target = "_blank"





var vel = velo
pasos = 4
var tot = 0
var tam =0;
var pos,pos2,tam2 =0;
function escribe(){
document.write ('<div id ="fuera" style="position:relative; width:' + ancho + 'px; height:' + alto + 'px;overflow:hidden">');
document.write ('<span id="imas" style="position:absolute; width:' + tam + 'px;height:' + alto + 'px; left = -' + tam + 'px;"  onmouseover="if(detienee == 0){detienee = 1}" onmouseout="clearTimeout(tiempo);detienee=0;atras = false;vel=velo;mueve()">');
for (m=0;m<imagenes.length;m++){
	if(imagenes[m].a != ""){
		document.write('<a href="' + imagenes[m].a + '" target="' + imagenes[m].target + '">')
		}
	document.write ('<img border="0"  src ="' + imagenes[m].src + '" id="ima' + m + '" name="ima' + m + '"  onload="tot++;">');
	if(imagenes[m].a != ""){document.write ('</a>')}
	}
document.write ('</span>');
document.write ('<span id="imas2" style="position:absolute; width:' + tam + 'px;height:' + alto + ';left=0;"  onmouseover="if(detienee == 0){detienee = 1}" onmouseout="clearTimeout(tiempo);detienee=0;atras = false;vel=velo;mueve()">');
for (m=0;m<imagenes.length;m++){
	if(imagenes[m].a != ""){
		document.write('<a href="' + imagenes[m].a + '" target="' + imagenes[m].target + '">')
		}
	document.write ('<img border="0" src ="' + imagenes[m].src + '" id="imaa' + m + '" name="imaa' + m + '" onload="tot++;">');
	if(imagenes[m].a != ""){document.write ('</a>')}
	}
document.write ('</span>');
document.write ('</div>');
}
var detienee = 0,posb,pos2b;
function mueve(){
pos = document.getElementById('imas').style.left;
pos2 = document.getElementById('imas2').style.left;
pos = pos.replace(/px/,"");
pos = pos.replace(/pt/,"");
pos = new Number(pos);
pos2 = pos2.replace(/px/,"");
pos2 = pos2.replace(/pt/,"");
pos2 = new Number(pos2);
if(detienee == 1){
	posb = pos;
	pos2b = pos2;
	}
if(atras == true){
pos-=dis;
pos2 -=dis;
}
else{
pos += dis;
pos2 += dis;
}
if(pos2 > (ancho + dis)){
	if(detienee == 0){
		document.getElementById('imas2').style.left = pos  - (tam + dis);
		pos2 = document.getElementById('imas2').style.left;
		}
	else{
		document.getElementById('imas').style.left = pos 
		}
	}
else{
	document.getElementById('imas').style.left = pos 
	}

if(pos > (ancho + dis)){
	if(detienee == 0){
		document.getElementById('imas').style.left = pos2 - (tam + dis);
		pos = document.getElementById('imas').style.left;
		}
	else{
		document.getElementById('imas2').style.left = pos2;
		}
	}
else{
	document.getElementById('imas2').style.left = pos2
	}
if(detienee > 0){
	if(detienee == pasos){
		vel = velo;
		atras = true;
		detienee--;
		tiempo = setTimeout('mueve()',vel);
		}
	else{
		if(atras == true){
			if(detienee>(pasos/2))
				{detienee--}
			else{
			vel = velo;
			clearTimeout(tiempo)
			}
			}
	else{
		detienee++
		}
	if(detienee > (pasos/2) && atras == false){vel +=10}
		if(detienee < (pasos/2)){vel +=10}
		tiempo = setTimeout('mueve()',vel)
		}
	}
else{
tiempo = setTimeout('mueve()',vel)
	}
if(atras == true){
		if (pos == posb){
			clearTimeout(tiempo);
			atras = false;
			}
		}
}
var tiempo;
var atras = false, ini;
function inicio(){
if(tot == (imagenes.length * 2)){clearTimeout(ini);reDimCapas();mueve()}
else{ini=setTimeout('inicio()',500)}
}
function reDimCapas(){
for(m=0;m<imagenes.length;m++){
	tam +=document.getElementById('ima'+m).width + 5
	document.getElementById('imas').style.left = (-tam +10);
	document.getElementById('imas').style.width = tam ;
	document.getElementById('imas2').style.width = tam;
	}
}

</script>
</head>

<body onLoad="inicio();" >
<div align="center" style="width:712px; height:54px; top: 0;">

<script>escribe();</script>
 </div>
<p> 
</p>
</body>
</html>
Losiento por tanto codigo...
  #2 (permalink)  
Antiguo 15/01/2013, 09:33
 
Fecha de Ingreso: julio-2008
Mensajes: 91
Antigüedad: 16 años, 8 meses
Puntos: 6
Respuesta: No entiendo que esta mal :S
Hola, en el ultimo for suma 20 en lugar de 5

Código Javascript: 
Ver original
  1. for(m=0;m<imagenes.length;m++){
  2.     tam +=document.getElementById('ima'+m).width + 20;
  3.     document.getElementById('imas').style.left = (-tam +10);
  4.     document.getElementById('imas').style.width = tam ;
  5.     document.getElementById('imas2').style.width = tam;
  6.     }
  7. }
  #3 (permalink)  
Antiguo 15/01/2013, 10:21
djkiku
Invitado
  
Mensajes: n/a
Puntos:
Respuesta: No entiendo que esta mal :S
Dioooooos que grande Raul!!! Muchisimas gracias va de lujo lujo lujo!!! Mil y una gracias!!!!!!

Etiquetas: html
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


« Tema Anterior | Próximo Tema »


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