Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.


Você não está conectado. Conecte-se ou registre-se

Botão navegação rápida

2 participantes

Ir para baixo  Mensagem [Página 1 de 1]

1 Botão navegação rápida Empty Botão navegação rápida Sáb Set 21, 2013 4:32 pm

d0C

d0C
Nivel 6

Link do fórum: http://corrente-grafica.forumeiro.com/

Versão: PUNBB

Imagens do problema: -

Descrição do problema: Olá, neste forum: http://bestskins.com.br/forum como podem ver no lado direito tem dois botões, e um titulado de "Navegação Rápida", e eu gostaria de o obter para colocar esse mesmo no meu forum!

PS: Eu gostaria de colocar esse botão ao lado do meu botoão de ver o novo conteudo, aliás gostarias de substituir o botao à sua direita pelo botao de navegação rápida.

Disponibilizo aqui meu overall_header:
Spoiler:

Obrigado, e espero que me possam ajudar!
Cumprimentos!

2 Botão navegação rápida Empty Re: Botão navegação rápida Sáb Set 21, 2013 6:58 pm

Cʀɑzy

Cʀɑzy
Admin
Admin

Olá,

Crie um novo código javascript:
Código:
$(function(){
 $('.attach').apped('<li class="attach"><a style="border-right:none; margin-right:-10px" href="#" rel="quickNavigation" acesskey="9" id="quickNavLaunch" title="Abrir navegação rápida"><span&nbsp;</span></a></li>
<style type="text/css">#quickNavLaunch {
background: url(http://i78.servimg.com/u/f78/17/96/03/52/icon_q10.png) no-repeat center top;display: inline-block;height: 13px;width: 13px;}
</style>');
$('.nav_fast').hide();
$('#quickNavLaunch').click(function() {
$('.nav_fast').show();
});
});
Crie um novo Widget com este código:
Código:
    <div class="nav_fast">
    <li><a onclick="jQuery('#quicknavbs').fadeToggle();" rel="quickNavigation" accesskey="9" id="quickNavLaunch" title="Abrir Navegação Rápida">Navegação rápida</a></li></div>
    <style>
    .nav_fast {
    bottom: 0;
    right: 0;
    padding: 9px;
    position: fixed;
    cursor: pointer;
    background: #eee;
    border: 1px solid #ddd;
    }
    .nav_fast a, .nav_fast a:hover {
    color: gray;
    }
    li {list-style-type: none;}
    </style>
                    <div id="quicknavbs" style="display:none;">
                    <div id="navigation_popup_popup" style="z-index: 10001; top: 45.5px; left: 370.5px; position: fixed;" class="popupWrapper"><div id="navigation_popup_inner" class="popupInner" style="width: 600px;"><h3>Navegação Rápida</h3><div class="fixed_inner ipsBox" style="height: 460px; max-height: 460px; overflow: auto;">
    <script>
    jQuery(document).ready(function(){
    jQuery('#main_abas').prepend(
    '<ul id="navebar">  <li><a>Geral</a></li> <li><a class="active">Forums</a></li></ul>')

    jQuery('.aba').css({
    display: 'none',
    marginTop: 0,
    borderTopWidth: 0
    })

    jQuery('#aba2').css('display', 'block');

    jQuery('a', jQuery('#navebar')).click(function() {
    var i = jQuery('a', jQuery('#navebar')).index(this) + 1;
    jQuery(this).parents('#main_abas').children('.aba:visible').hide();
    jQuery('#aba' + i).show();
    jQuery(this).parents('#navebar').find('a').removeClass('active');
    jQuery(this).addClass('active');
    })
    })
    </script><div id="main_abas"><div id="aba1" class="aba"><div class="block_list">
    <li><a href="h/search?search_id=newposts">Ver Novo Conteúdo </a></li>
    <li><a href="/viewonline">Usuários Online</a></li>
    <li><a href="/memberlist">Membros Registrados</a></li>
    </div>
    </div><div id="aba2" class="aba"><div id="category"></div>
      <script>jQuery("#category").load("/forum .main-head .page-title h2, .hierarchy");</script>
    </div>                                         
                            </div>
                      </div><div id="navigation_popup_close" onclick="jQuery('#quicknavbs').fadeOut();" class="popupClose clickable"><img src="http://i81.servimg.com/u/f81/18/07/42/17/close_11.png" alt="x"></div>
                  </div>
    </div>
    <style>
    div#category h2 {
    border-bottom: 1px solid #eaeaea;
    border-top: 1px solid #fff;
    font-weight: bold;
    display: block;
    padding: 5px 10px;
    }
    div#category .hierarchy {
    font-weight: normal!important;
    font-size: 11px;
    text-shadow: 0px 0px 0px;
    background: none;
    display: block;
    margin-left: 0px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #eaeaea;
    padding: 5px 10px;
    padding-left: 15px;
    }
    </style>
    <style>
    .popupWrapper {
    background: url('http://i72.servimg.com/u/f72/18/07/42/17/trans610.png') repeat;
    background: rgba(0,0,0,0.6);
    padding: 8px;
    -webkit-box-shadow: rgba(0,0,0,0.5) 0px 10px 20px;
    -moz-box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7);
    box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.7 );
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    }
    .popupInner {
    background: white;
    width: 500px;
    overflow: auto;
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);
    overflow-x: hidden;
    }
    .popupInner h3 {
    background: #eee url(http://i72.servimg.com/u/f72/18/07/42/17/highli13.png) repeat-x top;
    border-bottom: 1px solid #d8d8d8;
    text-shadow: rgba(255,255,255,0.8) 0px 1px 0px;
    padding: 8px 10px 9px;
    font-size: 16px;
    font-weight: 300;
    }
    .popupClose {
    position: absolute;
    right: 20px;
    top: 20px;
    }
    .ipsBox, .ipsPad {
    padding: 9px;
    }
    .ipsBox {
    background: #eee;
    }
    .block_list > li {
    padding: 5px 10px;
    list-style-type: none;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #eaeaea;
    }
    div.aba { 
      margin-left: 153px;
      background:#fcfcfc;
      text-align:justify;
      min-height: 400px;
      border: 1px solid #dcdcdc!important;
      }
    #navebar {
      border-top: 1px solid #dcdcdc;
      border-bottom: 1px solid #dcdcdc;
      border-left: 1px solid #dcdcdc;
      font:bold 12px tahoma,helvetica,arial,sans-serif;
      margin:0;
      float: left;
      }
    #navebar li {
      display: block;
      background: #f5f5f5;
      color: #808080;
      border-bottom: 1px solid #dcdcdc;
      list-style:none;
      }
    #navebar li a:hover {
      background:#f2f2f2;
      color:#808080;
      }
    #navebar li a.active {
    width: 135px;
    position: relative;
    z-index: 8000;
    border-right: 2px solid #fcfcfc;
    background: #fcfcfc;
    color: #353535;
    font-weight: bold;
    }
    #navebar li a {
      border-right: 1px solid #dcdcdc;
      font-weight: normal;
      cursor: pointer;
      background: #f5f5f5;
      color: #8d8d8d;
      padding: 10px 8px;
      outline: 0;
      color: #8d8d8d;
      -webkit-transition: background-color 0.1s ease-in-out;
      -moz-transition: background-color 0.3s ease-in-out;
      text-decoration:none;
      width:135px;
      display:block;
      }
    </style>

Até.

http://programando.forum-pro.net

3 Botão navegação rápida Empty Re: Botão navegação rápida Dom Set 22, 2013 6:57 am

d0C

d0C
Nivel 6

Olá Crazy!
Eu já utilizei esse código e esse código ficaria como um widget flutuante.
Eu quero fixar ele como disse na minha primeira mensagem.
Eu gostaria de colocar esse botão ao lado do meu botão de ver o novo conteúdo, aliás gostaria de substituir o botão à sua direita pelo botão de navegação rápida.

Obrigado.

4 Botão navegação rápida Empty Re: Botão navegação rápida Dom Set 22, 2013 9:34 am

Cʀɑzy

Cʀɑzy
Admin
Admin

Olá,

Sinceramente.. Ou o senhor testa, ou não terá ajuda de minha parte.

http://programando.forum-pro.net

5 Botão navegação rápida Empty Re: Botão navegação rápida Dom Set 22, 2013 11:13 am

d0C

d0C
Nivel 6

Não funciona como eu desejaria amigo Crazy... Sad

6 Botão navegação rápida Empty Re: Botão navegação rápida Dom Set 22, 2013 11:16 am

Cʀɑzy

Cʀɑzy
Admin
Admin

Meu caro,

Colocou o primeiro código? o senhor sabe o que e 'javascript' né?

Até..

http://programando.forum-pro.net

7 Botão navegação rápida Empty Re: Botão navegação rápida Dom Set 22, 2013 3:01 pm

d0C

d0C
Nivel 6

Obviamente!
Mas eu gostaria de o colocar fixo!

CUmprimentos.

8 Botão navegação rápida Empty Re: Botão navegação rápida Seg Set 23, 2013 12:28 pm

d0C

d0C
Nivel 6

UP!

9 Botão navegação rápida Empty Re: Botão navegação rápida Ter Set 24, 2013 5:36 pm

Cʀɑzy

Cʀɑzy
Admin
Admin

Olá,

Erro meu, desculpe.
Troque o código JS por esse:
Código:
$(function(){
 $('.attach').append('<li class="attach"><a style="border-right:none; margin-right:-10px" href="#" rel="quickNavigation" acesskey="9" id="quickNavLaunch" title="Abrir navegação rápida"><span </span></a></li>
<style type="text/css">#quickNavLaunch {
background: url(http://i78.servimg.com/u/f78/17/96/03/52/icon_q10.png) no-repeat center top;display: inline-block;height: 13px;width: 13px;}
</style>');
$('.nav_fast').hide();
$('#quickNavLaunch').click(function() {
$('.nav_fast').show();
});
});
Até..

http://programando.forum-pro.net

10 Botão navegação rápida Empty Re: Botão navegação rápida Qua Set 25, 2013 5:17 am

d0C

d0C
Nivel 6

Sem qualquer alteração...

11 Botão navegação rápida Empty Re: Botão navegação rápida Qua Set 25, 2013 6:02 pm

Cʀɑzy

Cʀɑzy
Admin
Admin

Olá,

No código acima procure por:
Código:
<span </span>
Troque por:
Código:
<span>NAVEGAÇÃO RÁPIDA </span>
Até.

http://programando.forum-pro.net

12 Botão navegação rápida Empty Re: Botão navegação rápida Qui Set 26, 2013 3:04 am

d0C

d0C
Nivel 6

Olá amigo Crazy.
Não seria melhor eu fornecer o meu overall_header?
Porque seria através do overall_header que eu desejaria aplicar o efeito.

Cumprimentos.

13 Botão navegação rápida Empty Re: Botão navegação rápida Qui Set 26, 2013 7:44 am

Cʀɑzy

Cʀɑzy
Admin
Admin

Olá,

Não meu caro, o código funcionou? Se não funcionou, forneça o seu template. Fazer pelo overall ou por javascript não muda nada..

Até mais.

http://programando.forum-pro.net

14 Botão navegação rápida Empty Re: Botão navegação rápida Sex Set 27, 2013 5:24 am

d0C

d0C
Nivel 6

overall_header:

Conteúdo patrocinado



Ir para o topo  Mensagem [Página 1 de 1]

Permissões neste sub-fórum
Não podes responder a tópicos