Foros del Web » Programando para Internet » Javascript »

Ayuda!! con icarousel

Estas en el tema de Ayuda!! con icarousel en el foro de Javascript en Foros del Web. Hola, he estado intentando hacer este carousel pero por mas que lo intento no me sale, segui los pasos y nada. Pagina- http://zendold.lojcomm.com.br/icarousel/example3.asp -Primero descaegue ...
  #1 (permalink)  
Antiguo 27/07/2008, 19:40
 
Fecha de Ingreso: marzo-2008
Mensajes: 46
Antigüedad: 16 años, 1 mes
Puntos: 0
Ayuda!! con icarousel

Hola, he estado intentando hacer este carousel pero por mas que lo intento no me sale, segui los pasos y nada.

Pagina- http://zendold.lojcomm.com.br/icarousel/example3.asp

-Primero descaegue mootoolsv1.1.js y lo yame mootols

-Luego descargue icarousel

-Luego lo llame a mi pagina html
Código HTML:
<script type="text/javascript" src="mootools.js"></script>  
<script type="text/javascript" src="iCarousel.js"></script> 
-Lego pegue el html
Código HTML:
<div id="example_3">
	<ul id="example_3_content">
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/1.jpg" alt="flower 1" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/2.jpg" alt="flower 2" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/3.jpg" alt="flower 3" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/4.jpg" alt="flower 4" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/5.jpg" alt="flower 5" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/6.jpg" alt="flower 6" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/7.jpg" alt="flower 7" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/8.jpg" alt="flower 8" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/9.jpg" alt="flower 9" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/A.jpg" alt="flower A" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/B.jpg" alt="flower B" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/C.jpg" alt="flower C" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/D.jpg" alt="flower D" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/E.jpg" alt="flower E" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/F.jpg" alt="flower F" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/G.jpg" alt="flower G" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/H.jpg" alt="flower H" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/I.jpg" alt="flower I" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/J.jpg" alt="flower J" /></a></li>
		<li class="example_3_item"><a href="#"><img src="http://www.forosdelweb.com/images/flowers/K.jpg" alt="flower K" /></a></li>
	</ul>
	<div id="example_3_frame">
		<img id="example_3_previous" src="http://www.forosdelweb.com/images/ex3_previous.gif" alt="move previous" />
		<img id="example_3_next" src="http://www.forosdelweb.com/images/ex3_next.gif" alt="move next" />
	</div>
</div> 
-Luego pegue el css entre head

Código HTML:
<style type="text/css">
/* example_3 css */
#example_3 {
	position: relative; /* important */
	overflow: hidden; /* important */
	width: 470px; /* important */
	height: 86px; /* important */
	margin: 0 85px;
	background: #000;
}

#example_3_frame {position: relative}
#example_3_previous {float: left;}
#example_3_next {float: right;}
#example_3_content {
	position: absolute;
	top: 0;
	margin-left: 20px;
}

#example_3_content
#example_3_content li {
	list-style: none;
	margin: 0;
	padding: 0;
}
	#example_3_content {
		width: 5418px;
	}
	#container_bd #example_3 ul li {
		display: block;
		float: left;
		margin: 5px;
		padding: 5px;
		border: 1px solid #666;
		background-color: #000;
	}

#container_bd #example_3 ul li img {
	display: block;
}
</style> 
-Luego el script

Código HTML:
<script type>
window.addEvent("domready", function() {
	new iCarousel("example_3_content", {
		idPrevious: "example_3_previous",
		idNext: "example_3_next",
		idToggle: "undefined",
		item: {
			klass: "example_3_item",
			size: 86
		},
		animation: {
			duration: 1000,
			amount: 4
		}
	});
});
</script> 
Lo guarde y nada, que hago?.Gracias de antemano
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 04:28.