LOG IN
Usuario:

Contraseña:


Últimos temas
» [PHPBB3] Tema Ubuntu
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Feb 27, 2024 10:22 am por hoanglongnhatbao

» [PHPBB3] Fondo y otros efectos al texto llamado "Por X" debajo de los titulos de los post.
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:52 am por hoanglongnhatbao

» Skin: Academy [Adaptado por: 15-tronos]
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:47 am por hoanglongnhatbao

» [PHPBB3] KN-Anime - VAngel.
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:46 am por hoanglongnhatbao

» [PHPBB3] Element Professional Style
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:45 am por hoanglongnhatbao

» Menu minimalista
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:44 am por hoanglongnhatbao

» [Todas] Efecto Slider Transition en el Logo
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:43 am por hoanglongnhatbao

» [PHPBB3] Mejores Posteadores flotantes.
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:41 am por hoanglongnhatbao

» [phpbb3] Agrandar el nombre de usuario en el perfil
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 EmptyMar Mayo 30, 2023 8:41 am por hoanglongnhatbao

Estadísticas
Tenemos 2351 miembros registrados
El último usuario registrado es Jhunky

Nuestros miembros han publicado un total de 41254 mensajes en 3360 argumentos.
Afiliados





No estás conectado. Conéctate o registrate

Ir a la página : Precedente  1, 2, 3  Siguiente

Ver el tema anterior Ver el tema siguiente Ir abajo  Mensaje [Página 2 de 3.]


giObanii

giObanii
Soy new user
Recuerdo del primer mensaje :

Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 Tutorialesforoactivocom

Autor:
giObanii fiOri (3mOtrOnik)

Descripción
Con este sencillo tutorial podras tener el tan anciado efecto Lightbox en las imagenes de los post en foros de foroactivo, ya sabemos que tenemos una herramienta que reduce la imagenes pero para ser sincero a mi no me gusto nadita yo esperaba algo con más convenciomiento. Pero despues de batallar unos dias para lograr hacerlo pues no soy un experto, logre hacer que las imagenes que esten en los post tengan un efecto Lightbox automaticamente ya que es posible hacerlo pero deberiamos insertar unas lineas de HTML y eso en verdad es frustrante para nuestros usuarios.





Instrucciones:
En realidad no haran casi nada ya que les he ahorrado el trabajo de alojar los archivos imagenes entre otras cosas ustedes simplemente copiaran el codigo correspondiente.

Nos dirigimos a:


Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 -Panel de administración
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 --Modulos
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 ---HTML & JAVASCRIPT
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 ----Gestión de los códigos Javascript


Copiamos el siguiente codigo: Responder el tema para ver.





Pueden Configurar "En todas las paginas" o en solo "En los temas" Cualquiera funciona pero solo afectara a las imagenes de los post.


Este paso es OPCIONAL ya que si tienen activada la opcion Redimension de las imágenes no es necesario.

Vamos a:

Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 -Panel de administración
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 --Visualización
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 ---Imágenes y Colores
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 ----Colores
Efecto Lightbox automatico en imagenes [Foroactivo] - Página 2 732987880 -----CSS Stylesheet:


y pegamos el CSS correspondiente:

PHPBB2
Código:
.postbody img  {max-width: 600px;}

PHPBB3
Código:
.postbody img {max-width: 600px;}

PUNBB
Código:
.entry-content img {max-width: 600px;}

INVISION
Código:
.post-entry img {max-width: 600px;}

En el codigo anterior pueden modificar 600px por la anchura maxima de las imagenes en tus post.

UPDATE: 20/06/12

El Script tambien es compatible con la opcion Redimension de las imágenes asi que no habra problema si tienes esta opcion activada.

Aademas oculta los enlaces que salen arriba de las imagenes que sobrepasan las dimensiones extablecidas los cuales son [Ampliar esta imagen. Clic aquí para ver su tamaño original]

UPDATE: 23/06/12
Se ha cambiado el aspecto del lightbox utilizando fancyBox.
Ademas esto resuelve el problema de las imagenes enormes que sobrepasaban la anchura del navegador.

Se ha añadido la posibilidad de que los enlaces que dirigen a videos de youtube se visualizen tipo lightbox.

Tambien se ha solucionado el error que las imagenes con enlace son afectadas por el script ahora se deshabilita el efecto para dichas imagenes.

No es necesario volver a copiar el codigo.



DEMO
Mas info...
.



Última edición por giObanii el Sáb Jun 23, 2012 11:53 pm, editado 17 veces

http://toxigeek.com


mumuko

mumuko
Soy new user
muchas gracias compa


ShadowJr

ShadowJr
+100 post
Muy bueno gracias!


Jotace

Jotace
+300 post
Y el código anterior? A mí el de antes era el que me funcionaba, éste no me funciona y me sigue apareciendo lo de ampliar imagen y ver tamaño normal además cuando entro a cualquier tema me sale un anuncio donde pone

"Efecto Lightbox automatico en imagenes [Foroactivo]"
Se han hecho modificaciones y es importante que vuelva a copiar el codigo.

Continuar

http://pokevento.tumblr.com/

farg25

farg25
Soy new user
Muy bueno Encantado


Ayax

Ayax
Mod.Códigos
Woow que ingenioso. pero no me funciona Zombie

http://biohazard.webmaster-foro.com

Javi!

Javi!
+300 post
oh baby i like it (:

http://www.designforum.foroactivo.com/

jonathan_309

jonathan_309
Soy new user
Esto es perfecto lo instalare muchas gracias Encantado


Shortly

Shortly
+100 post
posteo para ver!

http://tuforodeayuda.foroes.org

FON

FON
Miembro activo
Gracias, interesante.


Ghostwalker

Ghostwalker
Soy new user
a ver...


bonny999

bonny999
Soy new user
wooow, muy bueno!


Rey_86

Rey_86
Miembro activo
excelente tuto mil gracias


Petros_7

Petros_7
Miembro activo
gracias


Gio

Gio
Miembro activo
Muy bueno, gracias Canchero

http://www.world-one.org

Detroit

Detroit
Miembro activo
Comentando para ver Canchero

http://pcblast.forumeiros.com/

N3

N3
Soy new user
ver

http://pixelas.foroactivo.com/

Caitlynn

Caitlynn
Soy new user
Me encanta, le da un aspecto muy profesional al foro.


agy

agy
Miembro activo
ok posteo para ver ..


Potr3x

Potr3x
Soy new user
ver


mystery

mystery
+100 post
Quiero verlo se ve excelente


Dagger

Dagger
Miembro activo
graciwsd


Paul Alex

Paul Alex
Miembro activo
Muchas gracias por el tuto

http://digizone.foroargentina.net/forum

Prysmatic

Prysmatic
Soy new user
quiero ver


DooGy00

DooGy00
+100 post
posteo gracias


cruzitovlf

cruzitovlf
Soy new user
hola


Contenido patrocinado


Ver el tema anterior Ver el tema siguiente Volver arriba  Mensaje [Página 2 de 3.]

Ir a la página : Precedente  1, 2, 3  Siguiente

Permisos de este foro:
No puedes responder a temas en este foro.