Menu de login

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Menu de login

Mensagem por snow em 22/03/11, 10:25 pm

Qual é sua questão:
Neste topico http://ajuda.forumeiros.com/t39559-menu-de-login
o Profile ensinou o cara a usar o tipo de menu que mostra la no topico.
Eu me enteressei em usar ele tambem. So que a minha duvida e a seguinte... eu ate consigo usar o menu, ponho para logar por ele funciona. Mas so que e o seguinte logo quando eu me logo pelo menu que foi criado. La em cima continua com a opção " Olá visitante l Entrar " ao em vez de está dizendo Olá " meu login " e com a opção de " sair " logo ao lado. Já que estou logado.

Eu queria saber se alguem que entenda esse codigo pude-se corrigir para min por favor.

Que medidas você tomou para corrigir o problema:
nenhuma.

Apresente-nos imagens do problema (se necessário):


Última edição por snow em 30/03/11, 05:02 pm, editado 1 vez(es)
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Resolvido Re: Menu de login

Mensagem por #Frank! em 22/03/11, 11:17 pm

Olá !

Onde você colocou o código?
Outra, coisa.. mande o link de seu fórum para que possamos visualizá-lo melhor.


Atenciosamente.
BlueAngel.
avatar

#Frank!
Membro do Fórum

Feminino
Inscrito dia : 14/09/2009
Mensagens : 1128
Pontos Ativos : 1606

Ver perfil do usuário http://finite.forumeiros.com

Resolvido Re: Menu de login

Mensagem por snow em 22/03/11, 11:52 pm

Meu forum: http://testesdeforumdaype.forumeiros.com/

Eu pus o codigo aonde o profile explico no outro topico lá.
Visualização > Home Page > Geral > Mensagem na Home page> Conteúdo da mensagem:

Colei o codigo ali
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Resolvido Re: Menu de login

Mensagem por #Frank! em 23/03/11, 09:04 am

Olá !

Isto mesmo, é aí que coloca realmente.
Agora, tente colocar este código que darei abaixo neste mesmo local.

Código:


<!DOCTYPE>

<!-- 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">{USERLINK}</font><br />
<b>Mensagens:</b> {USERCOUNTPOST}
</span>
</td>

</tr>
</table>
</td>



<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Alterar</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a><br />
</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Ver</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a><br />
<a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a><br />
<a href="../search.forum?search_id=draftsearch">Rascunhos</a><br />
<a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a><br />
<a href="../rpg_sheet_edit.forum">Ficha de personagem</a><br />
</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b><br />
<a href="../msg.forum?folder=inbox">Mensagens Privadas</a><br />
<a href="../search.forum?search_topics={USERNAME}">Meus tópicos</a><br />
<a href="../search.forum?search_id=egosearch">Tópicos que participa</a><br />
<a href="../search.forum?search_author={USERNAME}&show_results=posts">Minhas mensagens</a><br />
<a href="../search.forum?search_id=newposts">Últimos tópicos</a><br />
</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>



<script>
jQuery(document).ready(function() {
msg = '© <b>2011 Todos os direitos reservados ao fórum central.</b>';
jQuery('#page-footer').html(jQuery('#page-footer').html() + msg);
});
</script>

Atenciosamente.
BlueAngel.

avatar

#Frank!
Membro do Fórum

Feminino
Inscrito dia : 14/09/2009
Mensagens : 1128
Pontos Ativos : 1606

Ver perfil do usuário http://finite.forumeiros.com

Resolvido Re: Menu de login

Mensagem por AjudaUsuário em 23/03/11, 09:47 am

Eu vou em painel de controle, vou nos botões e coloco uma imagem "Entrar" "Sair" . Abraços!
avatar

AjudaUsuário
Nível 3

Masculino
Inscrito dia : 30/01/2011
Mensagens : 15
Pontos Ativos : 29

Ver perfil do usuário http://evercheats.forumeiros.com

Resolvido Re: Menu de login

Mensagem por snow em 23/03/11, 02:09 pm

BlueAngel escreveu:Olá !

Isto mesmo, é aí que coloca realmente.
Agora, tente colocar este código que darei abaixo neste mesmo local.

Código:


<!DOCTYPE>

<!-- 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">{USERLINK}</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>

<a href="../rpg_sheet_edit.forum">Ficha de personagem</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={USERNAME}">Meus tópicos</a>

<a href="../search.forum?search_id=egosearch">Tópicos que participa</a>

<a href="../search.forum?search_author={USERNAME}&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>



<script>
jQuery(document).ready(function() {
msg = '© <b>2011 Todos os direitos reservados ao fórum central.</b>';
jQuery('#page-footer').html(jQuery('#page-footer').html() + msg);
});
</script>

Atenciosamente.
BlueAngel.


Muito obrigado angel já agradesci. Esse menu fico muito melhor que deixar ele como menu de login. Ele viro painel de controle. Agora eu queria saber se tem como deixa ele e todas as paginas do fórum ?
e também, se tem como deixar ele com menu de login e após o usuario se logar, ele some a opção de login e vira painel de controle... creio que não de pra fazer. Mas é apenas uma duvida. Se puder teria como fazer por favor ?
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Resolvido Re: Menu de login

Mensagem por Cream em 23/03/11, 02:20 pm

Olá,

Nunca tentei, mas pode tentar colocar o código em um widget. E sobre o painel sumir depois de logar, tente este:
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 Panel */
        #top {
        background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}
     
        #top ul.login {
        background: url(http://img832.imageshack.us/img832/2707/loginr.png) no-repeat right 0;}
     
        #top ul.login li.left {
        background: url(http://img823.imageshack.us/img823/1687/loginl.png) no-repeat left 0;}
     
        #top 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 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>
     
        <!-- Mootools - the core -->
   
        <script type="text/javascript"
    src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-core-yc.js"></script>
        <!--Toggle effect (show/hide login form) -->
   
        <script type="text/javascript"
    src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-more.js"></script>
   
        <script type="text/javascript"
    src="http://web-kreation.com/demos/login_form_mootools_1.2/js/fx.slide.js"></script>
     
     
        <script>
        var nnome = "{USERNAME}" ;
        if ( nnome != "Convidado"){
        document.write('  <style>  ');
        document.write('  #loginn{display:none!important;}  ');
        document.write('  </style>  ');
        }
        </script>
     
          <!-- Login -->
          <div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">
     
          <div id="login">
     
              <div class="loginContent">
     
 
              <form action="/login.forum" method="post"
enctype="multipart/form-data" name="form_login" id="form_login2">
     
                    <label for="log"><b>Username: </b></label>
                    <input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />
     
                    <label for="pwd"><b>Password:</b></label>
                    <input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />
     
                    <input class="menuoption button_login" type="submit" name="login" value=" " />
     
                    <input type="hidden" name="redirect" value="" />
     
                </form>
     
                <div class="left">
     
                      <label for="rememberme">
   
                    <input name="autologin"      id="autologin"
    type="checkbox"  tabindex="4" checked="checked" class="radio" />
    Conexão automática
                      </label>
     
                    </div>
     
   
              <div class="right">Não é um membro? <a
    href="/profile.forum?mode=register">Registar-me</a> | <a
    class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar
    Senha</a></div>
     
              </div>
     
              <div class="loginClose"><a href="#" id="closeLogin">Fechar Painel</a></div>
     
          </div>
     
     
        <!-- /login -->
     
     
     
            <div id="container">
     
              <div id="top">
     
              <!-- login -->
     
                <ul class="login">
     
                    <li class="left"> </li>
     
                      <li>Olá Visitante!</li>
     
                    <li>|</li>
     
                    <li><a id="toggleLogin" href="#">Entrar</a></li>
     
                </ul> <!-- / login -->
     
              </div> <!-- / top -->
     
     
     
                <div class="clearfix"></div>
          </div>
          </div>
     
        </div>

Abraços.
avatar

Cream
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 15/12/2010
Mensagens : 8540
Pontos Ativos : 11636

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Menu de login

Mensagem por snow em 23/03/11, 03:01 pm

Não, você não entendeu eu não quero que o painel de controle suma depois de logar. Na verdader eu quero que tenha o menu de login certo. Logo após logar eu quero que aparece o menu que o BlueAngel fez. Que na verdade é um painel de controle. entende ?
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Resolvido Re: Menu de login

Mensagem por snow em 24/03/11, 11:13 pm

Seguinte pessoal. Vou tentar exclarecer bem a minha dúvida.. primeiro vou postar as fotos e os codigos. Depois descrevo minha dúvida para ficar bem claro.


Codigo CSS da imagem acima:
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 Panel */
    #top {
    background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;}
 
    #top ul.login {
    background: url(http://img832.imageshack.us/img832/2707/loginr.png) no-repeat right 0;}
 
    #top ul.login li.left {
    background: url(http://img823.imageshack.us/img823/1687/loginl.png) no-repeat left 0;}
 
    #top 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 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>
 
    <!-- Mootools - the core -->
 
    <script type="text/javascript"
src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-core-yc.js"></script>
    <!--Toggle effect (show/hide login form) -->
 
    <script type="text/javascript"
src="http://web-kreation.com/demos/login_form_mootools_1.2/js/mootools-1.2-more.js"></script>
 
    <script type="text/javascript"
src="http://web-kreation.com/demos/login_form_mootools_1.2/js/fx.slide.js"></script>
 
 
    <script>
    var nnome = "Convidado" ;
    if ( nnome != "Convidado"){
    document.write('  <style>  ');
    document.write('  #loginn{display:none!important;}  ');
    document.write('  </style>  ');
    }
    </script>
 
      <!-- Login -->
      <div id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;">
 
      <div id="login">
 
          <div class="loginContent">
 
            <form action="/login.forum" method="post" enctype="multipart/form-data" name="form_login" id="form_login2">
 
                <label for="log"><b>Username: </b></label>
                <input name="username" size="23" class="field" maxlength="25" type="text" style="clear: both;" />
 
                <label for="pwd"><b>Password:</b></label>
                <input name="password" class="field" size="23" maxlength="25" type="password" style="clear: both;" />
 
                <input class="menuoption button_login" type="submit" name="login" value=" " />
 
                <input type="hidden" name="redirect" value="" />
 
            </form>
 
            <div class="left">
 
                  <label for="rememberme">
 
                <input name="autologin"      id="autologin"
type="checkbox"  tabindex="4" checked="checked" class="radio" />
Conexão automática
                  </label>
 
                </div>
 
 
          <div class="right">Não é um membro? <a
href="/profile.forum?mode=register">Registar-me</a> | <a
class="gensmall" href="/profile.forum?mode=sendpassword"> Recuperar
Senha</a></div>
 
          </div>
 
          <div class="loginClose"><a href="#" id="closeLogin">Fechar Painel</a></div>
 
      </div>
 
 
    <!-- /login -->
 
 
 
        <div id="container">
 
          <div id="top">
 
          <!-- login -->
 
            <ul class="login">
 
                <li class="left"> </li>
 
                  <li>Olá Visitante!</li>
 
                <li>|</li>
 
                <li><a id="toggleLogin" href="#">Entrar</a></li>
 
            </ul> <!-- / login -->
 
          </div> <!-- / top -->
 
 
 
            <div class="clearfix"></div>
      </div>
      </div>
 
    </div>
Até aqui beleza. O codigo funcionando certinho... como mostra na foto.

Agora seguinte... O angel fez um codigo de CSS se baseando nesse primeiro que mandei. Mas na verdade ele fez um "painel de controle" como mostra a imagem a baixo.

Codigo da imagem acima:
Código:
<!DOCTYPE>

<!-- 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">{USERLINK}</font><br />
<b>Mensagens:</b> {USERCOUNTPOST}
</span>
</td>

</tr>
</table>
</td>



<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Alterar</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Informações</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=preferences">Preferências</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=signature">Assinatura</a><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=avatars">Avatar</a><br />
</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Ver</b><br />
<a href="../profile.forum?mode=editprofile&amp;page_profil=friendsfoes">Amigos & ignorados</a><br />
<a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a><br />
<a href="../search.forum?search_id=draftsearch">Rascunhos</a><br />
<a href="../search.forum?search_id=favouritesearch">Tópicos favoritos</a><br />
<a href="../rpg_sheet_edit.forum">Ficha de personagem</a><br />
</span>
</td>

<td style="text-align:center;">
<span style="font-size: 1.2em;"><b>Tópicos & Mensagens</b><br />
<a href="../msg.forum?folder=inbox">Mensagens Privadas</a><br />
<a href="../search.forum?search_topics={USERNAME}">Meus tópicos</a><br />
<a href="../search.forum?search_id=egosearch">Tópicos que participa</a><br />
<a href="../search.forum?search_author={USERNAME}&show_results=posts">Minhas mensagens</a><br />
<a href="../search.forum?search_id=newposts">Últimos tópicos</a><br />
</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>



<script>
jQuery(document).ready(function() {
msg = '© <b>2011 Todos os direitos reservados ao fórum central.</b>';
jQuery('#page-footer').html(jQuery('#page-footer').html() + msg);
});
</script>

Beleza, agora vou esclarecer minha dúvida para ver se vocês conseguem me ajudar !
Seguinte eu quero usar os dois codigo. Como eu quero ?
Então a minha duvida e a seguinte. Se eu por o primeiro código para o usuario se logar, após logado ele continua com o menu de login. Eu queria fazer o seguinte... que se tem como vocês juntarem os 2 codigos para aparecer o menu la em cima de login quando o usuario não estiver logado, e após ele logar. aparecer já o menu la em cima de painel de controle.

Finalizando, eu quero pegar e por o menu de login, ai o cara vai lá e loga. Dps esse menu de login sai e entra o ( codigo que o angel fez ) segundo codigo que ta ali logo em baixo da segunda foto. Sendo assim após ele logar, some o menu de login e entra o menu de " painel de controle ".
Será que deu para entenderem minha duvida ?
Por favor me ajudem o mas rapido possivel !!
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Resolvido Re: Menu de login

Mensagem por #Frank! em 26/03/11, 08:18 pm

Olá !

Meu caro (a) , o código que lhe dei é de login com o painel creio eu.
Experimente-o e veja.

Atenciosamente.
BlueAngel.

avatar

#Frank!
Membro do Fórum

Feminino
Inscrito dia : 14/09/2009
Mensagens : 1128
Pontos Ativos : 1606

Ver perfil do usuário http://finite.forumeiros.com

Resolvido Re: Menu de login

Mensagem por snow em 26/03/11, 08:25 pm

Já testei, antes de postar é claro... Vou lher mostra na imagem como fica quando eu estou deslogado.


Obrigado por me responde, mas a minha duvida ainda não foi solucionada.
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Resolvido Re: Menu de login

Mensagem por snow em 30/03/11, 05:01 pm

Deixa pra lá, ngm entendeu minha duvida ou nao soube me responder. Vo por como resolvido. Obg por tentarem !
avatar

snow
Nível 4

Masculino
Inscrito dia : 16/05/2010
Mensagens : 32
Pontos Ativos : 65

Ver perfil do usuário http://ypeguild.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum