Fenix de Plata |
"> |
| Sorel | |
|
Cambiar el fondo en función del sexo. - 13/10/2012, 9:55 am
- Aclaraciones:
Para que este truco funcione, es necesario que el campo "género" esté visible en el perfil de mensajes, y esto, con una imagen y no sólo el texto! Vamos a crear una clase CSS fa_postbody_xy adicional (para los niños) y fa_postbody_xx (para las niñas) al cuerpo del mensaje según el género informado, y con esta nueva clase, vamos a ser capaces de personalizar el diseño del puesto mediante la manipulación de su CSS.
- Los códigos:
Ir al Panel de Administración - Modulos - HTML & Javascript - Gestion de los códigos Javascript
Crear un nuevo Javascript para aplicar "en los temas".
- Título: (Lo que usted quiera) - Posición: En los temas - Código Javascript:
- Código:
$(function() { //Indicate here the version of your forum. var version = "phpBB3"; if(version.toLowerCase() == "phpbb2"){ $(".postdetails img[title='Male']").closest('.postdetails').parent('td').next('td').addClass("fa_postbody_xy"); $(".postdetails img[title='Female']").closest('.postdetails').parent('td').next('td').addClass("fa_postbody_xx"); }else if(version.toLowerCase() == "phpbb3"){ $(".postprofile img[title='Male']").closest('.postprofile').prev('.postbody').addClass("fa_postbody_xy"); $(".postprofile img[title='Female']").closest('.postprofile').prev('.postbody').addClass("fa_postbody_xx"); }else if(version.toLowerCase() == "punbb"){ $(".user-info img[title='Male']").closest('.postmain').addClass("fa_postbody_xy"); $(".user-info img[title='Female']").closest('.postmain').addClass("fa_postbody_xx"); }else if(version.toLowerCase() == "invision"){ $(".postprofile img[title='Male']").closest('.post-container').addClass("fa_postbody_xy"); $(".postprofile img[title='Female']").closest('.post-container').addClass("fa_postbody_xx"); } }); Importante: Para que su funcionamiento es absolutamente necesario para indicar la versión de tu foro editando el valor de la versión variable, usted tiene la posibilidad de elegir entre phpBB2, phpBB3, punBB y Invision.
- Personalización de la CSS:
Por ejemplo, aquí tenemos un CSS que actúan sobre las dos clases que hemos creado, gracias a la javascript una imagen de fondo se aplicará, diferente dependiendo de su habilidad y de su imaginación.
Ir al Panel de Administración - Visualización - Imágenes y Colores - Colores - CSS stylesheet
- Código:
.fa_postbody_xy{ background: url("http://i45.servimg.com/u/f45/17/45/19/77/xy10.png"); min-height: 500px; } .fa_postbody_xx { background: url("http://i45.servimg.com/u/f45/17/45/19/77/xx10.png"); min-height: 500px; } Ya está hecho!!
- Muestra:
Tutorial creado por: TurbodeifCopyright© FORUMOTION.COM© Traducido por Sea
| Permisos de este foro: | No puedes responder a temas en este foro.
Código [IMG] está Activado Código HTML está Activado
|
|
|