Botão de perfil ao lado da página

Qual é minha questão:
Eu queria saber o código para fazer o perfil dos usuários fixarem ao lado da página, tipo, da mesma forma que tem o botão do chatbox para abrir, eu queria colocar o perfil...

Medidas que eu tomei para corrigir o problema:
Eu já vi essa pergunta, mas nao a achei nos tutoriais

Imagens do meu problema:
ñ tenho

Endereço do meu fórum:
http://historia-filosofia.forumeiros.com

Versão do meu fórum:
PHPBB2

o que eu queria fazer é ocultar esse perfil assim como é no code abaixo do chatbox:

Código:

<div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="/chatbox" id="chatboxpop" scrolling="yes" style="height: 350px; float: right; overflow-x: visible; overflow-y: visible; display: none; width:700px" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="jQuery('#chatboxpop').animate({width:'toggle'},1200); jQuery('#chatboxopen,#chatboxclose').toggle();" style="margin-top: 10px; cursor :pointer; float:left"><img src="http://i34.servimg.com/u/f34/16/04/51/75/open10.png" id="chatboxopen" style="display: inline; "><img src="http://i34.servimg.com/u/f34/16/04/51/75/close10.png" id="chatboxclose" style="cursor: pointer; display: none; "></div></div>

só q ao invés de colocar o chat, eu queria por as funções do perfil...
tem como?

Eu tentei fazer isso, mas não tive sucesso.
Tambem gostaria de saber se tem como fazer. =)

Eu me lembro de ter visto isso em algum fórum... mas nao sei se tem algum tópico explicando aqui...

Eu consegui, mas apenas alguns links. Variáveis não funcionam =(

Olá,

Autor, você vai ter que postar uma imagem pois, eu não consegui entender o que deseja.

punk_rkn... qual o code q vc usou?

Jeffrey, o problema é q nao lembro em qual fórum vi isso... mas por exemplo, eu queria colocar o painel do usuário exatamente como está aqui no FDF... as mesmas funções.. mas eu queria q tivesse um botão para ele aparecer, como no code do chatbox q eu mandei ali em cima...

Usei o do chatbox mesmo.
Fiz uma página HTML e subistituí no chatbox.
Assim:

Código:

        <div style="overflow: visible; position: fixed; bottom: 30px; height: 350px; right: 0px; z-index:1000;"><iframe src="MINHA_PÁGINA_HTML" id="chatboxpop" scrolling="yes" style="height: 350px; float: right; overflow-x: visible; overflow-y: visible; display: none; width:700px" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="jQuery('#chatboxpop').animate({width:'toggle'},1200); jQuery('#chatboxopen,#chatboxclose').toggle();" style="margin-top: 10px; cursor :pointer; float:left"><img src="http://i34.servimg.com/u/f34/16/04/51/75/open10.png" id="chatboxopen" style="display: inline; "><img src="http://i34.servimg.com/u/f34/16/04/51/75/close10.png" id="chatboxclose" style="cursor: pointer; display: none; "></div></div>

Mas, como eu disse, as variáveis não funcionam. Pegam apenas os links diretos, como "profile.forum?mode=editprofile&page_profil=informations" e afins. Ou talvez eu não tenha feito certo, não sei... nem tentei muito ^^'

Mas nesse code ainda tem partes do chatbox...
eu queria usar o botão aí pra abrir a parte do painel do usuário... Help!!!

Se alguém puder me ajudar vou esclarecer um pouco mais... queria colocar esse code:

Código:

<script src="http://illiweb.com/fa/js_16/collapsible_faq.js" type="text/javascript"></script>
<script>
jQuery(document).ready(function(){
 jQuery.get('http://ajuda.forumeiros.com/profile.forum?mode=editprofile&page_profil=avatars', function(data) {
 link = jQuery('.panel dl:first img', data).attr('src');
 jQuery('#avatar').attr('src', link);
 });
});

</script>
<span style="font-size: 1.2em;"><img id="avatar" src="http://2img.net/i/bl/logo.png" align="left" width="50"><font size="4">{USERLINK}</font><br>
<b>Mensagens:</b> <span id="usercountpost">{USERCOUNTPOST}</span><br>
<span id="friends_cook"></span><br>
<br></span>

<dl class="faq" style="margin-bottom: -1px !important;"><dt></dt><dd onClick="return CFAQ.display('l7', false);">
  <div style="cursor: pointer;" onClick="return CFAQ.display('l7', true);" onfocus="this.blur();"><img src="http://2img.net/i/fa/admin/icones/editer.png" style="width: 15px;height: 15px" border="0"> Alterar</div></dd><dd style="display:none;" id="l7"><span style="margin: 0pt 0px 0pt 0px; display: block;"><a href="http://ajuda.forumeiros.com/profile.forum?mode=editprofile&amp;page_profil=informations" target="_blank"> Informações </a></span><span style="font-size: ;">
<a href="../profile.forum?mode=editprofile&amp;page_profil=preferences" target="_blank"> Preferências </a></span><span style="font-size: ;"><a href="../profile.forum?mode=editprofile&amp;page_profil=avatars" target="_blank"> Avatar </a></span></dd><dd onClick="return CFAQ.display('l8', false);">
    <div style="cursor: pointer;" onClick="return CFAQ.display('l8', true);" onfocus="this.blur();"><img src="http://2img.net/i/fa/admin/icones/small_ico/support.png" style="width: 15px;height: 15px" border="0"> Ver</div></dd>
<dd style="display:none;" id="l8"><span style="margin: 0pt 0px 0pt 0px; display: block;"><a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes" target="_blank"> Amigos e ignorados</a></span><span style="font-size: ;"><a href="../search.forum?search_id=watchsearch" target="_blank"> Tópicos supervisionados </a></span><br><span style="font-size: ;"><a href="../search.forum?search_id=draftsearch" target="_blank"> Rascunhos </a></span><br><span style="font-size: ;"><a href="../search.forum?search_id=favouritesearch" target="_blank"> Tópicos favoritos</a></span></dd><dd onClick="return CFAQ.display('l9', false);">
      <div style="cursor: pointer;" onClick="return CFAQ.display('l9', true);" onfocus="this.blur();"><img src="http://2img.net/i/fa/admin/icones/small_ico/boite_email.png" style="width: 15px;height: 15px" border="0"> Tópicos e mensagens</div></dd><dd style="display:none;" id="l9"><span style="margin: 0pt 0px 0pt 0px; display: block;"><a href="../msg.forum?folder=inbox" target="_blank"> Mensagens Privadas</a></span><span style="font-size: ;"><a href="../search.forum?search_topics={USERNAME}" target="_blank"> Meus tópicos</a></span><br><span style="font-size: ;"><a href="../search.forum?search_id=egosearch" target="_blank"> Tópicos que participo </a></span><br><span style="font-size: ;"><a href="../search.forum?search_author={USERNAME}&show_results=posts" target="_blank"> Minhas mensagens</a></span><br><span style="font-size: ;"><a href="../search.forum?search_id=newposts" target="_blank"> Novas mensagens<br> <small>({USERLASTVISIT})</small></a></span></dd></dl>

Num widget, mas quero q esse widget seja dentro de um campo onde eu vou poder abrir com um botão, que é o code igaul ao do chatbox, que mandei ali acima... tem como?

Então, como eu havia falado eu peguei esse código ai e coloquei numa página HTML. Depois subistituí no código que mandei mais acima (MINHA_PÁGINA_HTML).
Mas como mencionei, as variáveis e os links que dependem das mesmas não funcionam.
Bem, foi só o que consegui fazer, afinal.
Abraço e boa sorte!

punk_rkn achei um code... mas queria modificálo...

Código:

<!-- The CSS -->
            <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
            <style>
            #login {
            overflow: visible;
            height: auto;
            -webkit-transition:  margin-top 0.5s ease-in-out 0s;
            -moz-transition:  margin-top 0.5s ease-in-out 0s;
            -o-transition:    margin-top 0.5s ease-in-out 0s;
            transition:    margin-top 0.5s ease-in-out 0s;
     
            }
     
            /* Login Panel I */
            #topp {
            height: 38px;
            position: relative;
            }
     
            #topp ul.login {
            display: block;
            position: relative;
            float: right;
            clear: right;
            height: 38px;
            width: auto;
            font-weight: bold;
            line-height: 38px;
            margin: 0;
            right: 150px;
            color: white;
            font-size: 80%;
            text-align: center;
            padding-right: 45px;
            }
     
            #topp ul.login li.left {
            height: 38px;
            width: 45px;
            padding: 0;
            margin: 0;
            display: block;
            float: left;
            }
     
            #topp ul.login li {
            text-align: left;
            padding: 0 6px;
            display: block;
            float: left;
            height: 38px;
            }
            #topp ul.login li a {color: #33CCCC;}
            #topp ul.login li a:hover {color: white;}
     
            /* Login Panel */
            #topp {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}
     
            #topp ul.login {
            background: url(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}
     
            #topp ul.login li.left {
            background: url(http://img41.imageshack.us/img41/3439/loginlc.png) no-repeat left 0;}
     
            #topp ul.login li {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}
     
            /*Login*/
            /* toggle effect - show/hide login*/
            #login {
            background: #1E1E1E;}
     
            #login .loginContent input:focus.field {
            background: #545454;}
     
            #login .loginContent{padding-top:0px;width:790px;height:100px;}
     
            #login .loginContent input.button_login {
            background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}
     
            #login .loginClose a {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}
     
            #login .loginClose a:hover {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}
            </style>
     
            <!-- Login --><div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"><div id="login" style="margin-top:-100px;"><div class="loginContent">
     
     
     
     
            <table  style="width:100%;"  border="0">
            <tr>
     
            <td style="text-align:center;">
            <table border="0">
            <tr>
     
            <td>
            <script>
            jQuery(document).ready(function(){
              jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
                  link = jQuery('.panel dl:first img', data).attr('src');
                  if(link){
                    jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
                  }else{
                    jQuery('#avatar').html('');
                  }
              });
            });
            </script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
            </td>
     
            <td>
            <span style="font-size: 1.2em;">
            <font size="4"><a href="http://pwn3dmods.forumbrasil.net/profile.forum?mode=viewprofile&u=283">{USERNAME}</a></font>
     
            <b>Mensagens:</b> {USERCOUNTPOST}
            </span>
            </td>
     
            </tr>
            </table>
            </td>
     
     
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Alterar</b>
     
            <a href="../profile.forum?mode=editprofile&page_profil=informations">Informações</a>
     
            <a href="../profile.forum?mode=editprofile&page_profil=preferences">Preferências</a>
     
            <a href="../profile.forum?mode=editprofile&page_profil=signature">Assinatura</a>
     
            <a href="../profile.forum?mode=editprofile&page_profil=avatars">Avatar</a>
     
            </span>
            </td>
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Ver</b>
     
            <a href="../profile.forum?mode=editprofile&page_profil=friendsfoes">Amigos & ignorados</a>
     
            <a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>
     
            <a href="../search.forum?search_id=draftsearch">Rascunhos</a>
     
            <a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a>
     
                 
            </span>
            </td>
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b>
     
            <a href="../msg.forum?folder=inbox">Mensagens Privadas</a>
     
            <a href="../search.forum?search_topics=Victor">Meus tópicos</a>
     
            <a href="../search.forum?search_id=egosearch">Tópicos que participa</a>
     
            <a href="../search.forum?search_author=Victor&show_results=posts">Minhas mensagens</a>
     
            <a href="../search.forum?search_id=newposts">Últimos tópicos</a>
     
            </span>
            </td>
     
            </tr>
            </table>
     
     
     
     
            </div>
     
            </div>
     
     
            <!-- /login --><div id="container"><div id="topp">
     
            <!-- login -->
     
            <ul class="login">
     
            <li class="left"> </li>
     
            <li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>
     
            </ul> <!-- / login -->
     
            </div> <!-- / topp --><div class="clearfix"></div>
            </div></p></div>

eu queria que aparecesse o avatar do usuário e queria tirar algumas informações como:

*o menu "VER" e todas as opções;
*e o menu "TÓPICOS E MENSAGENS" e todas suas opções...

Consegui editar o code do modo que eu queria... agora só tenho uma dúvida...
quero colocar esse painel em todas as páginas do fórum... e queria que aparecesse a imagem do AVATAR dos personagens...
aqui está o code para ser modificado...

Código:

                      <!-- The CSS -->
            <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
            <style>
            #login {
            overflow: visible;
            height: auto;
            -webkit-transition:  margin-top 0.5s ease-in-out 0s;
            -moz-transition:  margin-top 0.5s ease-in-out 0s;
            -o-transition:    margin-top 0.5s ease-in-out 0s;
            transition:    margin-top 0.5s ease-in-out 0s;
     
            }
     
            /* Login Panel I */
            #topp {
            height: 38px;
            position: relative;
            }
     
            #topp ul.login {
            display: block;
            position: relative;
            float: right;
            clear: right;
            height: 38px;
            width: auto;
            font-weight: bold;
            line-height: 38px;
            margin: 0;
            right: 150px;
            color: white;
            font-size: 80%;
            text-align: center;
            padding-right: 45px;
            }
     
            #topp ul.login li.left {
            height: 38px;
            width: 45px;
            padding: 0;
            margin: 0;
            display: block;
            float: left;
            }
     
            #topp ul.login li {
            text-align: left;
            padding: 0 6px;
            display: block;
            float: left;
            height: 38px;
            }
            #topp ul.login li a {color: #33CCCC;}
            #topp ul.login li a:hover {color: white;}
     
            /* Login Panel */
            #topp {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}
     
            #topp ul.login {
            background: url(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}
     
            #topp ul.login li.left {
            background: url(http://img41.imageshack.us/img41/3439/loginlc.png) no-repeat left 0;}
     
            #topp ul.login li {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}
     
            /*Login*/
            /* toggle effect - show/hide login*/
            #login {
            background: #1E1E1E;}
     
            #login .loginContent input:focus.field {
            background: #545454;}
     
            #login .loginContent{padding-top:0px;width:790px;height:100px;}
     
            #login .loginContent input.button_login {
            background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}
     
            #login .loginClose a {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}
     
            #login .loginClose a:hover {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}
            </style>
     
            <!-- Login --><div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"><div id="login" style="margin-top:-100px;"><div class="loginContent">
     
     
     
     
            <table  style="width:100%;"  border="0">
            <tr>
     
            <td style="text-align:center;">
            <table border="0">
            <tr>
     
            <td>
            <script>
            jQuery(document).ready(function(){
              jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
                  link = jQuery('.panel dl:first img', data).attr('src');
                  if(link){
                    jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
                  }else{
                    jQuery('#avatar').html('');
                  }
              });
            });
            </script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
            </td>
     
            <td>
            <span style="font-size: 1.2em;">
            <font size="4"><a href="http://pwn3dmods.forumbrasil.net/profile.forum?mode=viewprofile&u=283"><center>{USERNAME}</center></a></font>
     
            <b>Mensagens:</b> {USERCOUNTPOST}
            </span>
            </td>
     
            </tr>
            </table>
            </td>
     
     
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"> <center><b> Alterar </b></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=informations"><center> Informações </a></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=preferences"><center> Preferências </a></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=signature"><center> Assinatura </a></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=avatars"><center> Avatar </a></center>
     
            </span>
            </td>
     
           
     
            </tr>
            </table>
     
     
     
     
            </div>
     
            </div>
     
     
            <!-- /login --><div id="container"><div id="topp">
     
            <!-- login -->
     
            <ul class="login">
     
            <li class="left"> </li>
     
            <li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>
     
            </ul> <!-- / login -->
     
            </div> <!-- / topp --><div class="clearfix"></div>
            </div></p></div>

Avatar dos usuários ou a imagem da ficha de personagem (módulo RPG)?

Olá Karol!

Seu código já está pronto. Basta colocá-lo em algum widget personalizado.
Painel de controle ->> Módulos ->> Portal e widgets ->> Gestão dos widgets do fórum ->>
Procure por um widget e clique no "" adicionando esse código por lá.

Agora, que ficha está referindo-se?

Eu queria q aparecesse a foto q o usuario coloca no perfil, mas com esse code so ta aparecendo uma rodinha la tipo, q ta carregando... nao aparece foto nenhuma. E queria q o perfil aparecesse em todas as paginas do forum... tem como....

Olá!

Teste esse código para aparecer o avatar do usuário (esse código é o da sua ultima mensagem, mas modificado):

Código:

<!-- The CSS -->
            <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" />
            <style>
            #login {
            overflow: visible;
            height: auto;
            -webkit-transition:  margin-top 0.5s ease-in-out 0s;
            -moz-transition:  margin-top 0.5s ease-in-out 0s;
            -o-transition:    margin-top 0.5s ease-in-out 0s;
            transition:    margin-top 0.5s ease-in-out 0s;
     
            }
     
            /* Login Panel I */
            #topp {
            height: 38px;
            position: relative;
            }
     
            #topp ul.login {
            display: block;
            position: relative;
            float: right;
            clear: right;
            height: 38px;
            width: auto;
            font-weight: bold;
            line-height: 38px;
            margin: 0;
            right: 150px;
            color: white;
            font-size: 80%;
            text-align: center;
            padding-right: 45px;
            }
     
            #topp ul.login li.left {
            height: 38px;
            width: 45px;
            padding: 0;
            margin: 0;
            display: block;
            float: left;
            }
     
            #topp ul.login li {
            text-align: left;
            padding: 0 6px;
            display: block;
            float: left;
            height: 38px;
            }
            #topp ul.login li a {color: #33CCCC;}
            #topp ul.login li a:hover {color: white;}
     
            /* Login Panel */
            #topp {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}
     
            #topp ul.login {
            background: url(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}
     
            #topp ul.login li.left {
            background: url(http://img41.imageshack.us/img41/3439/loginlc.png) no-repeat left 0;}
     
            #topp ul.login li {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}
     
            /*Login*/
            /* toggle effect - show/hide login*/
            #login {
            background: #1E1E1E;}
     
            #login .loginContent input:focus.field {
            background: #545454;}
     
            #login .loginContent{padding-top:0px;width:790px;height:100px;}
     
            #login .loginContent input.button_login {
            background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}
     
            #login .loginClose a {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}
     
            #login .loginClose a:hover {
            background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}
            </style>
     
            <!-- Login --><div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"><div id="login" style="margin-top:-100px;"><div class="loginContent">
     
     
     
     
            <table  style="width:100%;"  border="0">
            <tr>
     
            <td style="text-align:center;">
            <table border="0">
            <tr>
     
            <td>
            <script>
            jQuery(document).ready(function(){
              jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
                  link = jQuery('form#register table.forumline td.row1 table tr td[align="center"] img', data).attr('src');
                  if(link){
                    jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');
                  }else{
                    jQuery('#avatar').html('');
                  }
              });
            });
            </script><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div>
            </td>
     
            <td>
            <span style="font-size: 1.2em;">
            <font size="4"><a href="http://pwn3dmods.forumbrasil.net/profile.forum?mode=viewprofile&u=283"><center>{USERNAME}</center></a></font>
     
            <b>Mensagens:</b> {USERCOUNTPOST}
            </span>
            </td>
     
            </tr>
            </table>
            </td>
     
     
     
            <td style="text-align:center;">
            <span style="font-size: 1.2em;"> <center><b> Alterar </b></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=informations"><center> Informações </a></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=preferences"><center> Preferências </a></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=signature"><center> Assinatura </a></center>
     
            <a href="../profile.forum?mode=editprofile&page_profil=avatars"><center> Avatar </a></center>
     
            </span>
            </td>
     
           
     
            </tr>
            </table>
     
     
     
     
            </div>
     
            </div>
     
     
            <!-- /login --><div id="container"><div id="topp">
     
            <!-- login -->
     
            <ul class="login">
     
            <li class="left"> </li>
     
            <li><a id="toggleLogin" href="#" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px');">Painel de Usuário</a></li>
     
            </ul> <!-- / login -->
     
            </div> <!-- / topp --><div class="clearfix"></div>
            </div></p></div>

Até mais.

Funcionou!!!

Muito obrigada Luciano98.... e Jeffrey tambem!

So mais uma pergunta... ha como deixar esse painel em todas as paginas do forum?

Olá!

Não sei se vai funcionar, pois o código é grande.

Aceda à "Gestão dos códigos JavaScript":
Painel de Controle Módulos Gestão dos códigos JavaScript

Clique em "Criar um novo JavaScript".

Título Escolha o título que quiser
Investimento Em todas as páginas

Codigo JavaScript:

Código:

function lgn(){document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-100px' : '0px')};jQuery(document).ready(function(){jQuery('.bodyline table:eq(0)').prepend('<!-- The CSS --><link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" /><style>#login {overflow: visible;height: auto;-webkit-transition: margin-top 0.5s ease-in-out 0s;-moz-transition: margin-top 0.5s ease-in-out 0s;-o-transition: margin-top 0.5s ease-in-out 0s;transition: margin-top 0.5s ease-in-out 0s;}/* Login Panel I */#topp {height: 38px;position: relative;}#topp ul.login {display: block;position: relative;float: right;clear: right;height: 38px;width: auto;font-weight: bold;line-height: 38px;margin: 0;right: 150px;color: white;font-size: 80%;text-align: center;padding-right: 45px;}#topp ul.login li.left {height: 38px;width: 45px;padding: 0;margin: 0;display: block;float: left;}#topp ul.login li {text-align: left;padding: 0 6px;display: block;float: left;height: 38px;}#topp ul.login li a {color: #33CCCC;}#topp ul.login li a:hover {color: white;}/* Login Panel */#topp {background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}#topp ul.login {background: url(http://img18.imageshack.us/img18/3017/loginrw.png) no-repeat right 0;}#topp ul.login li.left {background: url(http://img41.imageshack.us/img41/3439/loginlc.png) no-repeat left 0;}#topp ul.login li {background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;}/*Login*//* toggle effect - show/hide login*/#login {background: #1E1E1E;}#login .loginContent input:focus.field {background: #545454;}#login .loginContent{padding-top:0px;width:790px;height:100px;}#login .loginContent input.button_login {background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;}#login .loginClose a {background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;}#login .loginClose a:hover {background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;}</style><!-- Login --><div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"><div id="login" style="margin-top:-100px;"><div class="loginContent"><table style="width:100%;" border="0"><tr><td style="text-align:center;"><table border="0"><tr><td><div id="avatar"><center><img src="http://i53.tinypic.com/1e1fex.gif"></center></div></td><td><span style="font-size: 1.2em;"><font size="4"><a href="http://pwn3dmods.forumbrasil.net/profile.forum?mode=viewprofile&u=283"><center>{USERNAME}</center></a></font><b>Mensagens:</b> {USERCOUNTPOST}</span></td></tr></table></td><td style="text-align:center;"><span style="font-size: 1.2em;"> <center><b> Alterar </b></center><a href="../profile.forum?mode=editprofile&page_profil=informations"><center> Informações </a></center><a href="../profile.forum?mode=editprofile&page_profil=preferences"><center> Preferências </a></center><a href="../profile.forum?mode=editprofile&page_profil=signature"><center> Assinatura </a></center><a href="../profile.forum?mode=editprofile&page_profil=avatars"><center> Avatar </a></center></span></td></tr></table></div></div><!-- /login --><div id="container"><div id="topp"><!-- login --><ul class="login"><li class="left"> </li><li><a id="toggleLogin" href="#" onclick="lgn()">Painel de Usuário</a></li></ul> <!-- / login --></div> <!-- / topp --><div class="clearfix"></div></div></p></div>')});jQuery(document).ready(function(){jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {link = jQuery('form#register table.forumline td.row1 table tr td[align="center"] img', data).attr('src');if(link){jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">');}else{jQuery('#avatar').html('');}});});

Clique em "Confirmar".

Até mais.

Deu certo Luciano98!!
Muito obrigado pela ajuda!!!

Duvida resolvida, pode fechar!