LOG IN
Usuario:

Contraseña:


Últimos temas
» [PHPBB3] Estadísticas Y ¿Quien esta en Linea? como PUNBB.
Dom Ago 20, 2017 1:29 am por +Luigi!

» [PHPBB3] Recuadro a el contenido y el titulo de "¿Quien esta en Linea?".
Dom Ago 20, 2017 1:27 am por +Luigi!

» Free Forum Ranks
Lun Ago 14, 2017 3:10 am por sukerwold

» RPG Forum Ranks (Double Pack)
Lun Ago 14, 2017 3:09 am por sukerwold

» [MEGAPACK] Todos los iconos que necesitas para tu foro en un solo lugar!! -Proximamente PSD- INCLUYE EPS
Lun Ago 14, 2017 1:33 am por osmardj

» info del user al dar clic al nombre del user en el index
Vie Ago 04, 2017 10:22 pm por tyhr

» Nebula Resource Pack
Jue Ago 03, 2017 6:41 pm por Aikazen

» Skin Teen Pro9x [ PunBB ]
Lun Jun 05, 2017 3:39 am por profesional

» Ranks 3
Miér Mayo 31, 2017 11:17 pm por zotinyx

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

Nuestros miembros han publicado un total de 41211 mensajes en 3358 argumentos.
Afiliados





No estás conectado. Conéctate o registrate

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


Este tutorial funciona para todas las versiones de foroactivo y es libre de compartir / modificar

Con este codigo lograremos darle un bonito efecto hover deslizante a las imagenes de la descripcion de los subforos. (Este efecto funciona en Firefox y Chrome, para IE no funciona).

Algo asi seria al pasar el mouse por encima del subforo:



Para Invision: PA > visualización > imagenes y colores > colores > css
Código:
    .par.forum-name img, .forum-desc img {
        position: relative;
        float: right !important;
        right: 40%;
        opacity: 0.5;
        visibility:hidden;
        }
        .par.forum-name:hover img, .forum-desc:hover img {
        opacity: 1;
        right: 2%;
        visibility:visible;
        -webkit-transition: all 1.0s ease-out; -moz-transition: all 1.0s ease; -o-transition: all 1.0s ease;
        }

Para PHPbb3: PA > módulos > html y javascript > gestion de los códigos javascript

Creamos uno nuevo y marcamos En el Índice
Código:
document.writeln('<style>\ndd.dterm img {\nposition: relative;\nfloat: right !important;\nright: 40%;\nopacity: 0.5;\nvisibility:hidden;\n}\ndd.dterm:hover img {\nright: 2%;\nopacity: 1;\nvisibility:visible;\n-webkit-transition: all 1.0s ease-out; -moz-transition: all 1.0s ease; -o-transition: all 1.0s ease;\n}\n<\/style>');

Para PHPbb2: PA > módulos > html y javascript > gestion de los códigos javascript

Creamos uno nuevo y marcamos En el Índice
Código:
document.writeln('<style>\n.row1.over img, .genmed img {\nposition: relative;\nfloat: right !important;\nright: 40%;\nopacity: 0.5;\nvisibility:hidden;\n}\n.row1.over:hover img, .genmed:hover img {\nopacity: 1;\nright: 2%;\nvisibility:visible;\n-webkit-transition: all 1.0s ease-out; -moz-transition: all 1.0s ease; -o-transition: all 1.0s ease;\n}\n<\/style>');

Para PUNbb: PA > módulos > html y javascript > gestion de los códigos javascript

Creamos uno nuevo y marcamos En el Índice
Código:
document.writeln('<style>\n.pun table td.tcl img {\nposition: relative;\nfloat: right !important;\nright: 40%;\nopacity: 0.5;\nvisibility:hidden;\n}\n.pun table td.tcl:hover img {\nopacity: 1;\nright: 2%;\nvisibility:visible;\n-webkit-transition: all 1.0s ease-out; -moz-transition: all 1.0s ease; -o-transition: all 1.0s ease;\n}\n\n.pun tbody.statused span.status img {\nposition: relative;\nfloat: left;\nright: auto;\nopacity: 1;\nvisibility: visible;\n}\n<\/style>');

Ver perfil de usuario

Interesante Encantado
Gracias por aportar!


- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Mai Tuitah: @ElDelTKM
Mai Youtuf chanel: http://youtube.com/StormMadafaqas
Mai Tuenti: Storm Madafaqas Gfx
Mai Skaip: Madafaqas
Ver perfil de usuario http://www.webdesignforo.net/

Gracias por el aporte.

Ver perfil de usuario

Muy bueno!

Ver perfil de usuario

es interesante y yo lo buscaba

Ver perfil de usuario

Contenido patrocinado


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

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