Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje09-09-2011, 00:11 (UTC)    
Título del mensaje: [jQuery] Slide de imagen | Efecto 1
Responder citando
Hola amigos.
En esta ocasion les ofresco un Slide de imagenes, obviamente no es mio, la fuente es www.malsup.com.

Les cuento que este slide lo voy a traer en varios efectos . El efecto que les traigo es un efecto muy bueno . Pueden ver una Vista previa aqui :
http://brianpwg.es.tl/slides.htm

Comenzemos.
Para que esta Galeria funcione, debemos agregar la Libreria jQuery
Cita:
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>

Por ensima de la Pagina lo debemos colocar,o en el editor Html, las dos son lo mismo.

Ahora lo que haremos es colocar la Funcion -o- Efecto de esta Galeria
Cita:
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>

Por ensima de la Pagina lo debemos colocar,o en el editor Html, las dos son lo mismo. (Siempre debajo de la Libreria Js para no confundir)

Ahora colocaremos el CSS
Cita:
<style type="text/css">
.slideshow { height: 232px; width: 232px; margin: auto }
.slideshow img { padding: 15px; border: 1px solid #ccc; background-color: #eee; }
</style>

Por dabajo de la Libreria Js y el Codigo Javascript-


Y ahora, finalmente el Html :
Cita:
<div class="slideshow"><img width="200" height="200" alt="" src="URL DE LA IMAGEN" /> <img width="200" height="200" alt="" src="URL DE LA IMAGEN" /> <img width="200" height="200" alt="" src="URL DE LA IMAGEN" /> <img width="200" height="200" alt="" src="URL DE LA IMAGEN" /> <img width="200" height="200" alt="" src="URL DE LA IMAGEN" /></div>


Bueno, seguramente todo PWG debe saber como Editar el HTML, pero si no lo Saben, lo explico :
URL DE LA IMAGEN : Es la Imagen que colocaremos
200: Es el ancho de la Imagen
200: Es la altura de la Imagen.
-------------------------------------------------------------------------------------

Mas Slides :

Slide2
Slide3
-------------------------------------------------------------------------------------
Bueno amigos, eso es todo.Espero que les haga gustado y les Sea util.

Saludos
BrianPwg


Ultima edición por brianpwg el Jue Sep 08, 2011 8:58 pm; editado 2 veces
↑
Mensaje20-09-2011, 22:05 (UTC)    
Título del mensaje: Hola
Responder citando
Como estas, gracias por el tuto y codigo, pero soy no vato y no se en que parte exactamente debo pegar cada codigo, espero puedas ayudarme, tengo ice blue.

Saludos
↑
Mensaje20-09-2011, 22:14 (UTC)    
Título del mensaje:
Responder citando
esta wapo brian buen aporte,saludos
______________
Reglas del Foro

¿Dónde hacer mi tema/post?
↑
Mensaje20-09-2011, 22:15 (UTC)    
Título del mensaje:
Responder citando
Buen aporte Brian!
______________
↑
Mensaje20-09-2011, 23:00 (UTC)    
Título del mensaje:
Responder citando
Buen aporte

Saludos
______________


Super Mario la lleva, es lo mejor en Videojuegos, se los recomiendo
↑
Mensaje22-09-2011, 00:06 (UTC)    
Título del mensaje: Re: Hola
Responder citando
hobbiecls escribió:
Como estas, gracias por el tuto y codigo, pero soy no vato y no se en que parte exactamente debo pegar cada codigo, espero puedas ayudarme, tengo ice blue.

Saludos

Hola amigo, los codigos se pegan en:
EDITAR DISEÑO - Configuraciones avanzadas - Y lo pegas Segun corresponda. Es simple. Si tienes problemas, dejame un MP
______________
Es una reina, es una reina, fiesta fiesta. Tito el bambino
↑
Mensaje08-10-2011, 16:47 (UTC)    
Título del mensaje:
Responder citando
Hola a tod@s,

lo he intentado varias veces pero las imagenes me aparecen una debajo de otra no en forma de slide.

¿Por qué?

Un saludo.
↑
Mensaje08-10-2011, 17:26 (UTC)    
Título del mensaje:
Responder citando
eltransbordador escribió:
Hola a tod@s,

lo he intentado varias veces pero las imagenes me aparecen una debajo de otra no en forma de slide.

¿Por qué?

Un saludo.

Sera por que no haz pegado los codes correctamente?
↑
Mensaje08-10-2011, 18:59 (UTC)    
Título del mensaje:
Responder citando
Buen Post Pero :

Lea por favor las reglas de Acerca de Codigos:
http://www.paginawebgratis.es/forum/viewtopic.php?t=66177

Cita:
Primera norma general:
[+] Todo código compartido debe de adjuntar el vínculo directo a la fuente, por ejemplo si compartes un código del elwebmaster.com, debes de colocar la dirección completa al mismo y no la página central "elwebmaster.com".

______________
↑
Mensaje08-10-2011, 19:15 (UTC)    
Título del mensaje:
Responder citando
infopwg escribió:
Buen Post Pero :

Lea por favor las reglas de Acerca de Codigos:
http://www.paginawebgratis.es/forum/viewtopic.php?t=66177

Cita:
Primera norma general:
[+] Todo código compartido debe de adjuntar el vínculo directo a la fuente, por ejemplo si compartes un código del elwebmaster.com, debes de colocar la dirección completa al mismo y no la página central "elwebmaster.com".

Este codigo lo publique hace 200 años y la fuente se mensiona,
↑
Mensaje08-10-2011, 20:00 (UTC)    
Título del mensaje:
Responder citando
Cuando intento ver la vista previa del slide sale que la pagina no existe.
______________

Noticias Relevantes
Diablo III llegara el 15 de mayo
Se desvela Angry Birds Space
Call of Duty: Black Ops 2 podria anunciarse el 28
La portatil Neo Geo es oficial
Hemos activado nuestro foro... ¡ Entrar al foro !
↑
Mensaje08-10-2011, 20:03 (UTC)    
Título del mensaje:
Responder citando
noti-gamer escribió:
Cuando intento ver la vista previa del slide sale que la pagina no existe.


La pagina fue borrada amigo. No cuesta nada colocar los codigos en el editor y hay sale.
↑
Mensaje08-10-2011, 20:08 (UTC)    
Título del mensaje:
Responder citando
Men pusiste el sitio principal pero en fin
______________
↑
Mensaje19-12-2011, 18:56 (UTC)    
Título del mensaje:
Responder citando
Excelente
______________
[img[/img:872askjd]
↑
Mostrar mensajes anteriores:   
  • Página 1 de 1

  •  
    • Saltar a:  


Powered by phpBB © 2001, 2005 phpBB Group

© 2024 webme GmbH, Alemania. Todos los derechos reservados.