Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje04-06-2013, 04:48 (UTC)    
Título del mensaje: sildeshow

Hola como poner un slideshow o sea un cuadro de imagines o fotos que cambie automaticamente x cada Segundo... y a cada imagen se le pueda poner una discriccion ..... me dan algun codigo que funcione
Mensaje04-06-2013, 07:17 (UTC)    
Título del mensaje: Re: sildeshow

hola, el tema slide es facil... pero complejo..
si pones slider en el buscador veras decenas de temas que muestran sliders, incluso yo mismo preparé uno, pero no lo encuentro :D

de todas formas, aqui vi uno:
http://www.paginawebgratis.es/forum/viewtopic.php?t=64921&highlight=slide

para ajustarlo, debes comprender css
______________

10 años ayudando a la comunidad!!
>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
Mensaje05-06-2013, 03:45 (UTC)    
Título del mensaje:

Hola encontre este codigo pero no me funciona bien se ve deformada las fotos... y no giran automaticamente las fotos quien me lo revisa aver que es lo malo que tiene para que automaticamente se muevan las fotos sin nesecidad de hacer click....este es el codigo
Código:
<div id="ayax1"><div id="ayaximages" style="left: -480px; ">
<a href="URL1" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077624imagescabce6h3.jpg"></a>
<a href="URL2" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
<a href="URL3" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
<a href="URL4" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
<a href="URL5" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
<a href="URL6" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
<a href="URL7" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
<a href="URL8" ><img src="http://s2.subirimagenes.com/privadas/previo/thump_2077626imagescaoowu69.jpg"></a>
</div></div><div id="ayaxlinks">
<a onclick="srcANIMayax(0);" href="javascript:void(0);">1</a>
<a onclick="srcANIMayax(1);" href="javascript:void(0);">2</a>
<a onclick="srcANIMayax(2);" href="javascript:void(0);">3</a>
<a onclick="srcANIMayax(0);" href="javascript:void(0);">4</a>
<a onclick="srcANIMayax(1);" href="javascript:void(0);">5</a>
<a onclick="srcANIMayax(2);" href="javascript:void(0);">6</a>
<a onclick="srcANIMayax(6);" href="javascript:void(0);">7</a>
<a onclick="srcANIMayax(7);" href="javascript:void(0);">8</a></div>

<style>
#ayax1 { height: 375px; width: 480px;
margin: 0 auto;
overflow: hidden;
position: relative;
-moz-border-shadow: 0 0 10px black;
border-shadow: 0 0 10px black;
-webkit-border-shadow: 0 0 10px black;
-o-border-shadow: 0 0 10px black;
}
#ayaximages { position:absolute;
left: 0; top: 0;
width: 350px;
 moz-transition:all 1s ease-in-out;
-webkit-transition:all 1s.ease-in-out;
-o-transition:all 1s.ease-in-out;
transition:all 1s ease-in-out;
}
/* las imágenes, tamaño height y width*/
#ayaximages img {-moz-transition:all 4s ease-in-out;
-webkit-transition:all 4s.ease-in-out;
-o-transition:all 4s.ease-in-out;
transition:all 4s ease-in-out;
height: 375px;
width: 480px;
}

/* Ahora los botones , donde se cambia la visualización y colores*/
#ayaxlinks {padding: 7px 0;
width: 480px;
background-image: none;
background-repeat: repeat-x;
background-color: #;
border: 1px #000000:;
text-align: center;
margin-right: 250px;}
/* el HOVER al pasar el mouse sobre los botones*/
#ayaxlinks:hover {padding: 7px 0;width: 480px;background-image: none;background-repeat: repeat-x;background-color: #;border: 1px #000000:;text-align: center;margin-top:1px;}
/* EL COLOR DE EL TEXTO/LINKS */
#ayaxlinks a { background-color: #292929; border-radius: 8px; box-shadow: 0 0 5px #292929; margin: 0 2px; padding: 10px 10px; text-decoration: none;}
/* HOVER DE LOS LINKS AL PASAR EL MOUSE */
#ayaxlinks a:hover { box-shadow: 0 0 8px #292929; color: white; text-shadow:2px 2px 2px; black}
</style>
<script>
//<![CDATA[
 function srcANIMayax(num) {
 var mover = num * 480;
 document.getElementById("ayaximages").style.left = -mover + "px";
 }
//]]>
</script>
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group