Perfil do Usuário no Tópico

Olá,

Estava a personalizar a área do tópico e adicionei o sistema que separa os perfis em quadros, ate ai tudo bem mais queria juntar três perfis específicos em um só quadro, que seria os perfis no print abaixo

https://i.imgur.com/nEvQDNp.png

Código JS do perfis em quadros

Código:

jQuery(document).ready(function(){
    jQuery(".pun .post .user, .post .postprofile dl").each(function(){
    jQuery(this).html(jQuery(this).html().replace(/<span class="label/g,'<dd><div class="field"><span class="label'));
    });
    jQuery("td.row2 span,td.row1 span").each(function(){
    jQuery(this).html(jQuery(this).html().replace(/<span class="label/g,'<div class="field"><span class="label'));
    });
    jQuery("td.row2 span,td.row1 span").each(function(){
    jQuery(this).html(jQuery(this).html().replace(/<br/g,'</div><br'));
    });
    jQuery(".field").css({"background-color":"white","margin-bottom":"3px","margin-right":"11px","height":"auto","padding":"5px 5px 5px 5px","text-align":"center","margin-left":"10px","border":"1px solid #ccc"});
    jQuery("td.row2 span").css({"max-width":"300px"});
    });

Tópico Exemplo : http://webskins.forumeiros.com/t2-web-skins-regras

Até

Olá!

O link do tópico de exemplo que você postou não contém o que está nesta imagem: https://i.imgur.com/nEvQDNp.png
Faço-os aparecer no link de exemplo e terás a solução.

JS

Olá,

Você precisa estar registrado eu acho.

Até

Então lamento, mas não ficarei me cadastrando em vários fóruns só para resolver questões...

Mas é fácil de resolver: Basta liberar a visualização para convidados!

JS

Olá,

Pronto coloquei para convidados

Até

Quakeline escreveu:Olá,

Pronto coloquei para convidados

Até

Perfeito, agora desative o JS que faz esse "efeito" para que eu possa testar o meu ok?

Aguardo,

JS

Olá,

Pronto retirei

Até

Aqui está o código:

Código:


jQuery(document).ready(function(){
 var oTarget = jQuery(".pun .post .user, .post .postprofile dl");
 var len = oTarget.length - 1;

 for (var index = len; index >= 0; index--) {
 oThis = jQuery(oTarget[index]);
 oThis.html(oThis.html().replace(/<span class="label/g,'<dd><div class="field"><span class="label'));
 }

 jQuery("td.row2 span,td.row1 span").each(function(){
        jQuery(this).html(jQuery(this).html().replace(/<span class="label/g,'<div class="field"><span class="label'));
 });
 jQuery("td.row2 span,td.row1 span").each(function(){
        jQuery(this).html(jQuery(this).html().replace(/<br/g,'</div><br'));
 });

 jQuery(".field").css({"background-color":"white","margin-bottom":"3px","margin-right":"11px","height":"auto","padding":"5px 5px 5px 5px","text-align":"center","margin-left":"10px","border":"1px solid #ccc"});
 jQuery("td.row2 span").css({"max-width":"300px"});

 oTarget = jQuery(".postbody .user .user-info dd");
 len = oTarget.length - 1;

 jQuery(oTarget[len - 2]).addClass('unnified').css({ "background-color": "white", "border": "1px solid #ccc", "margin-left": "10px", "margin-right": "10px" });
 
 jQuery(oTarget[len]).detach().appendTo(jQuery(oTarget[len - 2]));
 jQuery(oTarget[len - 1]).detach().appendTo(jQuery(oTarget[len - 2]));
 
 jQuery(".unnified div").css("border", "none");
});


Apesar de o código estar uma verdadeira "bagunça", é funcional, só estou sem tempo de otimizá-lo...

Resultado:

---

Edit:
Nos teste que eu fiz no console, o código abaixo também funcionou normalmente, faz um teste ai se poder ok:

Spoiler:

Código:


jQuery(document).ready(function(){
   var oTarget = jQuery(".pun .post .user, .post .postprofile dl");
   var len = oTarget.length - 1;

   for (var index = len; index >= 0; index--) {
      oThis = jQuery(oTarget[index]);
      oThis.html(oThis.html().replace(/<span class="label/g,'<dd><div class="field"><span class="label'));
   }

   jQuery("td.row2 span,td.row1 span").each(function(){
        jQuery(this).html(jQuery(this).html().replace(/<span class="label/g,'<div class="field"><span class="label'));
   });

   jQuery(".field").css({"background-color":"white","margin-bottom":"3px","margin-right":"11px","height":"auto","padding":"5px 5px 5px 5px","text-align":"center","margin-left":"10px","border":"1px solid #ccc"});
   jQuery("td.row2 span").css({"max-width":"300px"});

   oTarget = jQuery(".postbody .user .user-info dd");
   len = oTarget.length - 1;

   jQuery(oTarget[len - 2]).addClass('unnified').css({ "background-color": "white", "border": "1px solid #ccc", "margin-left": "10px", "margin-right": "10px" });

   jQuery(oTarget[len]).detach().appendTo(jQuery(oTarget[len - 2]));
   jQuery(oTarget[len - 1]).detach().appendTo(jQuery(oTarget[len - 2]));

   jQuery(".unnified div").css("border", "none");
});


JS

Olá,

Os dois funcionou como eu desejava, só quero uma alteração, queria que eles ficassem um do lado do outro igual aqui no fdf

Até

Quakeline escreveu:Olá,

Os dois funcionou como eu desejava, só quero uma alteração, queria que eles ficassem um do lado do outro igual aqui no fdf

Até

Dessa forma vocês nos fazem "trabalhar" à toa!
Custava ter descrito tudo o que desejava no primeiro tópico?

---

Experimente trocar pelo código abaixo, não testei, foi só de "cabeça":

Código:


jQuery(document).ready(function(){
    var oTarget = jQuery(".pun .post .user, .post .postprofile dl");
    var len = oTarget.length - 1;

    for (var index = len; index >= 0; index--) {
    oThis = jQuery(oTarget[index]);
    oThis.html(oThis.html().replace(/<span class="label/g,'<dd><div class="field"><span class="label'));
    }

    jQuery("td.row2 span,td.row1 span").each(function(){
            jQuery(this).html(jQuery(this).html().replace(/<span class="label/g,'<div class="field"><span class="label'));
    });
    jQuery("td.row2 span,td.row1 span").each(function(){
            jQuery(this).html(jQuery(this).html().replace(/<br/g,'</div><br'));
    });

    jQuery(".field").css({"background-color":"white","margin-bottom":"3px","margin-right":"11px","height":"auto","padding":"5px 5px 5px 5px","text-align":"center","margin-left":"10px","border":"1px solid #ccc"});
    jQuery("td.row2 span").css({"max-width":"300px"});

    oTarget = jQuery(".postbody .user .user-info dd");
    len = oTarget.length - 1;

    jQuery(oTarget[len - 2]).addClass('unnified').css({ "background-color": "white", "border": "1px solid #ccc", "margin-left": "10px", "margin-right": "10px" });
   
    jQuery(oTarget[len]).find('img').detach().appendTo(jQuery(oTarget[len - 2]));
    jQuery(oTarget[len - 1]).find('img').detach().appendTo(jQuery(oTarget[len - 2]));
    jQuery(oTarget[len]).remove();
    jQuery(oTarget[len - 1]).remove();   
   
    jQuery(".unnified img").css("margin-top", "10px");
});


JS

Olá,

Não resultou só dois ficaram corretos, um ficou errado.
Desculpa não avisar antes

Até

Experimente o código abaixo, também só testei na minha cabeça:

Código:


jQuery(document).ready(function(){
     var oTarget = jQuery(".pun .post .user, .post .postprofile dl");
     var len = oTarget.length - 1;

     for (var index = len; index >= 0; index--) {
     oThis = jQuery(oTarget[index]);
     oThis.html(oThis.html().replace(/<span class="label/g,'<dd><div class="field"><span class="label'));
     }

     jQuery("td.row2 span,td.row1 span").each(function(){
            jQuery(this).html(jQuery(this).html().replace(/<span class="label/g,'<div class="field"><span class="label'));
     });
     jQuery("td.row2 span,td.row1 span").each(function(){
            jQuery(this).html(jQuery(this).html().replace(/<br/g,'</div><br'));
     });

     jQuery(".field").css({"background-color":"white","margin-bottom":"3px","margin-right":"11px","height":"auto","padding":"5px 5px 5px 5px","text-align":"center","margin-left":"10px","border":"1px solid #ccc"});
     jQuery("td.row2 span").css({"max-width":"300px"});

     oTarget = jQuery(".postbody .user .user-info dd");
     len = oTarget.length - 1;

     jQuery(oTarget[len - 2]).addClass('unnified').css({ "background-color": "white", "border": "1px solid #ccc", "margin-left": "10px", "margin-right": "10px" });
    
 jQuery(oTarget[len -2]).find('img').detach().appendTo(jQuery(oTarget[len - 2]));
     jQuery(oTarget[len]).find('img').detach().appendTo(jQuery(oTarget[len - 2]));
     jQuery(oTarget[len - 1]).find('img').detach().appendTo(jQuery(oTarget[len - 2]));
 
 jQuery(oTarget[len]).remove();
 jQuery(oTarget[len - 1]).remove();
     jQuery(".unnified div").remove();
 
     jQuery(".unnified img").css("margin-top", "10px");
});


Nota: Caso não funcione, remova o código e eu farei os testes diretamente em seu fórum!

JS

Olá,

Agora sim funcionou perfeitamente, vlw

Até