Estoy creando una página de perfil personalizada para mi foro, inspirada por la página de perfil de este foro (y la de algunos otros).
El diseño no es la parte difícil del asunto, pues se más o menos qué es lo que quiero cuando termine. Pero, antes de continuar metiendo divs y acomodando todo, quise intentar plasmar la información de alguno de los campos de perfil dentro de uno de los divs, por ejemplo el campo de “mensajes” (o posts).
Investigando sobre el asunto, llegue a está función de JS que se supone que hace lo que quiero. No puedo decir que no funciona, pero lo que hace no es lo esperado. En lugar de poner en el div la cantidad de mensajes (lo que quiero en este caso), lo desaparece (al menos reviso en google chrome y el div deja de ser visible en la estructura del sitio).
Esta es la función JS, el cual debería colocar el contenido de “field_id-6” (mi campo de mensajes) dentro del div con la clase mueve_field.
- Código:
$(function () {
$('.mueve_field').each(function () {
$(this).replaceWith($('#' + $(this).text()));
});
});
Y acá está lo que tengo de pagina de perfil..
- Código:
<div id="nombredeuser">{USERNAME}</div>
<div id="box1">
<div id="box2">
<table class="tabla1">
<tr>
<td>
<div class="avatarpro1"><div class="avatarpro2">{AVATAR_IMG}</div></div>
</td>
<td>
<div id="estadisticas">
<div class="mueve_field">field_id-6</div>
</div>
</td>
</tr>
</table>
</div>
</div>
También les dejo el css por si necesitan checarlo.
- css:
- /* hoja de perfil*/
/*tabla*/
table.tabla1 td{
vertical-align:top}
/*contenido*/
#box1{
background-color: darkgrey;
width: 100%;
height: 900px;
border: 30px solid black;
}
#box2{
width: 100%;
heigth: auto;
}
#nombredeuser{
width: 100%;
text-align: center;
font-size: 20px;
background-color: white;
margin-bottom: 40px;
padding-top: 45px;
padding-bottom: 25px;
}
.avatarpro1{
width: 270px;
heigth: 470px;
border: 10px solid white;
margin-top: 10px;
margin-left: 10px;
}
.avatarpro2 {
width: 250px;
heigth: 450px;
}
#estadisticas{
width: 300px;
margin-right: 100px;
background-color: white;
text-align: center;
height: 200px;
}
.mueve_field{
width:100px;
height: 100px;
border: 1px dashed black;
font: black;
font-size: 14;
}
Y pues eso , no estoy seguro si tengo algo mal o si exprese mal el profile field que ando pidiendo (los cambié entre field_id-6 y {field_id-6} y he estado buscando una solución al problema por más de una semana (?). No les estoy diciendo que hagan el trabajo por mi, pero sí que me muestren la luz al final del túnel si es posible. (?)
Saludos y gracias de antemano.