Painel de usuário fixo no fórum

[dudu.r.oliveira]

tipo eu coloquei um code no meu forum q tava funcionando blz ate esses dias, dai eu fui tenta coloca pra quando descese a pagina ele descese junto e deu isso.

SEM O CODE:

ou: https://2img.net/r/ihimizer/img339/3815/semttuloch.png



COM O CODE:

ou: https://2img.net/r/ihimizer/img683/8596/bugaddoooo.png

Código:

<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">
 
 
 
 
    <center><table  style="width:100%;"  border="0">
    <tr>
 
    <td style="text-align:center;">
    <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>
    <font color="#E9A210"><BIG><BIG><strong>Olá {USERNAME}</strong></big></big></font>
    <br>

    <br>
    <font color="#E9A210"><BIG><strong><b>Data/Hora:</b></strong></big></font>
    <br>

    <font color="#E9A210"><BIG><strong><script type="text/javascript" language="JavaScript">

var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += (hours >= 12) ? " PM" : " AM"
timerRunning = true;

mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday= mydate.getDate();
weekday= myweekday;

if(myday == 0)
day = " Domingo, "

else if(myday == 1)
day = " Segunda, "

else if(myday == 2)
day = " Terça, "

else if(myday == 3)
day = " Quarta, "

else if(myday == 4)
day = " Quinta, "

else if(myday == 5)
day = " Sexta, "

else if(myday == 6)
day = " Sábado, "

if(mymonth == 0)
month = " de Janeiro de "

else if(mymonth ==1)
month = " de Fevereiro"

else if(mymonth ==2)
month = " de Março"

else if(mymonth ==3)
month = " de April de "

else if(mymonth ==4)
month = " de Maio"

else if(mymonth ==5)
month = " de Junho de "

else if(mymonth ==6)
month = " de Julho"

else if(mymonth ==7)
month = " de Agosto de "

else if(mymonth ==8)
month = " de Setembro"

else if(mymonth ==9)
month = " de Outubro"

else if(mymonth ==10)
month = " de Novembro"

else if(mymonth ==11)
month = " de Dezembro"

document.write( day + myweekday + month  + " - " + timeValue);

</script></big><strong></font>
    </span>
    </td>
 
    </tr>
    </table></center>
    </td>


    </span>
    </td>
   
 
    <div style="text-align: center;">
    <td style="text-align:center;">
    <span style="font-size: 1.2em;"><b>Alterar</b>
    <br>
    <br>
 
    <a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Perfil</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=""></a><br>

    <a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>

    <a href=""></a><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>

    <a href=""></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 participo(a)</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>

    <div style="text-align: center;">
    <td style="text-align:center;">
    <span style="font-size: 1.2em;"><b>Noticias Oficiais</b>
    <br>
    <br>

    <a href="http://perfect-rp.forumeiros.com/t436-reformulacao-da-staff">Reformulação da STAFF</a><br>

    <a href="http://perfect-rp.forumeiros.com/t312-team-speak-3-perfect-roleplay">Team Speak 3</a><br>
    </span>
    </td>
 
    </tr>
    </table> </center>
 
 
 
 
    </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 do Usuário</a></li>
 
    </ul> <!-- / login -->
 
    </div> <!-- / topp --><div class="clearfix"></div>

voces podem me ajudar a arrumar e se possivel ele descer junto com a pagina?

vlw

[Luciano98]

Olá!

Uma dúvida, esse código que você passou no tópico está funcionando corretamente? Caso sim, eu faço isso que você quer, dele ficar fixo na página.

Até mais.
Luciano98.

[dudu.r.oliveira]

ele estava, mais eu nao sei oque eu fis que ele ta bugando a pagina quando eu coloco, queria ajuda nisso

[Convidad]

Prezado, dudu.r.oliveira

Boa noite !

Você adicionou algum código recentemente de linguagem javascript?
Noto, que em uma das imagens há um gênero de painel de controle, e na próxima a outro.

Veja então se modificando o painel de usuário e introduzindo o código novamente o problema persiste.

Atenciosamente.

[Oto!]

Caro Dudu,

Você adicionou algum tipo de Widget?Ocorreu alguma modificação no fórum?
Houve criação de alguma página .JS ou HTML?

Até Mais
Mr.Helper

[dudu.r.oliveira]

eu deletei uma pagina .js mais o code ja estav la antes disso

[Oto!]

Olá,

se lembra do código?
Crie novamente uma .JS.E tente.

Se der certo nos avise ok?

Até Mais

[dudu.r.oliveira]

era um fade de transiçao de paginas, eu n tenho mais o code dele, vou procurar no historico o code original pra ver se desbuga

[Dury]

Olá e bom dia Dudu.

Eu tentei uma modificação no código. Veja se da resultados esperados:

Código:

<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) fixed 0 0;}
 
    #topp ul.login {
    background: url(http://img18.imageshack.us/img18/3017/loginrw.png) fixed right 0;}
 
    #topp ul.login li.left {
    background: url(http://img41.imageshack.us/img41/3439/loginlc.png) fixed left 0;}
 
    #topp ul.login li {
    background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) fixed 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) fixed 0 0;}
 
    #login .loginClose a {
    background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) fixed right 0;}
 
    #login .loginClose a:hover {
    background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) fixed 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">
 
 
 
 
    <center><table  style="width:100%;"  border="0">
    <tr>
 
    <td style="text-align:center;">
    <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>
    <font color="#E9A210"><BIG><BIG><strong>Olá {USERNAME}</strong></big></big></font>
    <br>

    <br>
    <font color="#E9A210"><BIG><strong><b>Data/Hora:</b></strong></big></font>
    <br>

    <font color="#E9A210"><BIG><strong><script type="text/javascript" language="JavaScript">

var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += (hours >= 12) ? " PM" : " AM"
timerRunning = true;

mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday= mydate.getDate();
weekday= myweekday;

if(myday == 0)
day = " Domingo, "

else if(myday == 1)
day = " Segunda, "

else if(myday == 2)
day = " Terça, "

else if(myday == 3)
day = " Quarta, "

else if(myday == 4)
day = " Quinta, "

else if(myday == 5)
day = " Sexta, "

else if(myday == 6)
day = " Sábado, "

if(mymonth == 0)
month = " de Janeiro de "

else if(mymonth ==1)
month = " de Fevereiro"

else if(mymonth ==2)
month = " de Março"

else if(mymonth ==3)
month = " de April de "

else if(mymonth ==4)
month = " de Maio"

else if(mymonth ==5)
month = " de Junho de "

else if(mymonth ==6)
month = " de Julho"

else if(mymonth ==7)
month = " de Agosto de "

else if(mymonth ==8)
month = " de Setembro"

else if(mymonth ==9)
month = " de Outubro"

else if(mymonth ==10)
month = " de Novembro"

else if(mymonth ==11)
month = " de Dezembro"

document.write( day + myweekday + month  + " - " + timeValue);

</script></big><strong></font>
    </span>
    </td>
 
    </tr>
    </table></center>
    </td>


    </span>
    </td>
   
 
    <div style="text-align: center;">
    <td style="text-align:center;">
    <span style="font-size: 1.2em;"><b>Alterar</b>
    <br>
    <br>
 
    <a href="../profile.forum?mode=editprofile&amp;page_profil=informations">Perfil</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=""></a><br>

    <a href="../search.forum?search_id=watchsearch">Tópicos supervisionados</a>

    <a href=""></a><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>

    <a href=""></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 participo(a)</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>

    <div style="text-align: center;">
    <td style="text-align:center;">
    <span style="font-size: 1.2em;"><b>Noticias Oficiais</b>
    <br>
    <br>

    <a href="http://perfect-rp.forumeiros.com/t436-reformulacao-da-staff">Reformulação da STAFF</a><br>

    <a href="http://perfect-rp.forumeiros.com/t312-team-speak-3-perfect-roleplay">Team Speak 3</a><br>
    </span>
    </td>
 
    </tr>
    </table> </center>
 
 
 
 
    </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 do Usuário</a></li>
 
    </ul> <!-- / login -->
 
    </div> <!-- / topp --><div class="clearfix"></div>

[dudu.r.oliveira]

acho que foi o forum que bugo '-'


se coloca o code ali em home page > geral ele buga

[Cream]

acho que foi o forum que bugo '-'


se coloca o code ali em home page > geral ele buga

Pode nos mostrar uma imagem de como fica?

Atenciosamente!

[dudu.r.oliveira]

aqui está:

https://2img.net/r/ihimizer/img683/8596/bugaddoooo.png

[Luciano98]

aqui está:
https://2img.net/r/ihimizer/img683/8596/bugaddoooo.png

Eu não estou vendo nenhum bug ai, somente o "Painel do usuário".
Poderia explicar melhor qual o bug desse painel do usuário? Ele não desce quando você clica nele?

Até mais.

[dudu.r.oliveira]

vc nao percebeu o jeito que a pagina esta? --'


repare bem, os sub forum todos grudados

[Dury]

Olá,

Desculpe, comparando sua primeira imagem com a segunda não houve quaisquer problemas visuais Dudu. Se possível, nos envie o endereço do seu fórum.