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