Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
» Como adicionar um fundo a barra de menus?
Hoje à(s) 01:38 am por SetRaiden

» Como remover essas bordas dos avatares?
Hoje à(s) 01:31 am por SetRaiden

» Preciso de uma logo
Hoje à(s) 01:05 am por odelgado

» [FAQ] Gerir e configurar o Topic'it no seu fórum Forumeiros
Ontem à(s) 11:15 pm por Shek

» Preciso de Ajuda.
Ontem à(s) 11:12 pm por Shek

» Plaquinhas de Rank para o meu Fórum
Ontem à(s) 07:41 pm por Lost154

» Publicidade bugada
Ontem à(s) 07:31 pm por virus

Instale agora o aplicativo Topic'it e acesse o suporte de Forumeiros pelo celular.
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Quem está conectado
196 usuários online :: Nenhum usuário registrado, Nenhum Invisível e 196 Visitantes :: 1 Motor de busca

Nenhum

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Informações no hover

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

Resolvido Informações no hover

Mensagem por Luiis_. em 22/11/15, 08:05 pm

Detalhes da questão


Endereço do fórum: http://luiiswebdesigner.forumeiros.com/forum
Versão do fórum: PunBB

Descrição


Eae pessoal bom queria saber se vocês podem me ajudar neste efeito hover que quando passa o mause em cima dos forum das categorias aparece o numero de mensagens e topicos criado naquele forum

http://imgur.com/a4mWc21


O Efeito se encontra neste fórum : www.surcape.com

Até mais zen


Última edição por Luiis_. em 28/11/15, 11:24 am, editado 1 vez(es)
avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por Fraise em 23/11/15, 01:21 am

Boa noite, Luis.

Consulte este tópico:
Seta http://ajuda.forumeiros.com/t102510-#713744

Até mais.
Fraise

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5020
Pontos Ativos : 6700

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Informações no hover

Mensagem por Luiis_. em 23/11/15, 07:02 pm

Olá @Fraise

Bom usei os codigos mencionados pelo autor do topico que você me indico, não geriu nenhum efeito ela fico completamente normal como se não tivesse colocado nenhum efeito, vou deixar os codigos ativos ainda se caso precisar...

Até mais zen
avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por Slurk em 24/11/15, 09:39 am

Aqui está amigo um código JS que pode resultar;

Aceda o Painel de controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScripts

E crie uma nova página .JS, vamos em Investimento, marcar a opção No índice e colar o seguinte código:

Código:
jQuery(function(){jQuery('li.row dd.topics, li.row dd.posts, li.header dd.topics, li.header dd.posts').css('display','none');jQuery('li.row').hover(function(){posts=jQuery(this).find('dd.posts').html();topics=jQuery(this).find('dd.topics').html();jQuery(this).find('dd.dterm div h3').append('<span class="row_info" style="display: none; background-color: #F3F3F3; border: 1px solid #eee; padding: 3px; margin-left: 20px; width: auto;"><strong>'+topics+'</strong> Tópicos & <strong>'+posts+'</strong> Mensagens</span>');jQuery('.row_info').show(1000).css('display','inline')},function(){jQuery('.row_info').hide(1000).remove()})});
avatar

Slurk
Nível 10

Masculino
Inscrito dia : 23/11/2015
Mensagens : 273
Pontos Ativos : 427

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

Resolvido Re: Informações no hover

Mensagem por JrMAFiA em 24/11/15, 10:30 am

Deixe esse código e crie mais um JavaScript com este:
Código:
jQuery(function() {
    jQuery('li.row dd.topics, li.row dd.posts, li.header dd.topics, li.header dd.posts').css('display', 'none');
    jQuery('li.row').hover(function() {
        posts = jQuery(this).find('dd.posts').html();
        topics = jQuery(this).find('dd.topics').html();
        jQuery(this).find('dd.dterm div h3').append('<span class="row_info" style="display: none; background-color: #F3F3F3; border: 1px solid #eee; padding: 3px; margin-left: 20px; width: auto;"><strong>' + topics + '</strong> Tópicos & <strong>' + posts + '</strong> Mensagens</span>');
        jQuery('.row_info').show(1000).css('display', 'inline')
    }, function() {
        jQuery('.row_info').hide(1000).remove()
    })
});
Código:
jQuery(function() {
    jQuery('li.row dd.topics, li.row dd.posts, li.header dd.topics, li.header dd.posts').css('display', 'none');
    jQuery('li.row').hover(function() {
        posts = jQuery(this).find('ul.forums').html();
        topics = jQuery(this).find('ul.topiclist').html();
        jQuery(this).find('a.forumtitle').append('<span class="row_info" style="display: none; background-color: #F3F3F3; border: 1px solid #eee; padding: 3px; margin-left: 20px; width: auto;"><strong>' + topics + '</strong> Tópicos & <strong>' + posts + '</strong> Mensagens</span>');
        jQuery('.row_info').show(1000).css('display', 'inline')
    }, function() {
        jQuery('.row_info').hide(1000).remove()
    })
});

Lembrando que o primeiro código apenas deverá estar com o investimento No Índice e este Em todas as páginas.

Feliz
avatar

JrMAFiA
Usuário avançado

Masculino
Inscrito dia : 20/04/2015
Mensagens : 377
Pontos Ativos : 638

Ver perfil do usuário

Resolvido Re: Informações no hover

Mensagem por Luiis_. em 24/11/15, 10:41 am

Olá rapazes

Utilizei o codigo dos dois que me indicarão mais infelizmente nenhum fez efeito.
avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por MateusAnjosV em 24/11/15, 03:48 pm

Boa tarde Luis!

Antes de prosseguir com o seu suporte limitado, devo salientar que o seu fórum está ilegal perante as CGU. Recomendo urgentemente a busca pela ilegalidade disposta em seu fórum e que a corrija, pois, isso poderá acarretar na perda do seu fórum.



Quanto a sua questão, fiz este código javascript, apenas adicione-o e aplique no índice:
Código:
$(function(){
 $('.statused tr').each(function(){
 var dados = $(this).find('.tc3.col_stats').text();
 $(this).find('a.forumtitle').append('<div id="atalhosmateus" style="display: none;background: black;color: white !important;width: 140px; padding: 5px;border-radius: 100px;padding-left: 15px;position: relative;left: 28%;top: -20px  ">'+dados+'</div>')
 .mouseover(function(){
 $(this).find('#atalhosmateus').show();
 }).mouseleave(function(){
 $(this).find('#atalhosmateus').hide();
 });
 });

 
});

Ok? Atenciosamente,
MateusAnjos.


Última edição por MateusAnjosV em 24/11/15, 07:39 pm, editado 1 vez(es)
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1434
Pontos Ativos : 2008

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

Resolvido Re: Informações no hover

Mensagem por Luiis_. em 24/11/15, 06:13 pm

Olá matheus

Bom o codigo que você me passou funcionou, mais porem falta algumas partes que eu desejo

1 - No balãozinho, dentro da caixa de texto que aparece nele como nesta imagem http://imgur.com/t1q78o9

Eu queria deixar por Exemplo " 1 Tópico - 4 Respostas "

2 - Como retirar está parte http://imgur.com/9KxaXXD

3 - Fazer um efeito de transição quando passasse o mause em cima ele aparece com uma velocidade meio lenta.

Até mais zen

avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por Luiis_. em 25/11/15, 06:38 pm

@UP
avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por Slurk em 26/11/15, 11:03 am

amigo, peço que troque o codigo de nosso amigo Matheus, por este:

Código:
jQuery(function(){jQuery('table.table tbody.statused tr').mouseenter(function(){jQuery(this).find('.hover_stats').fadeIn('slow').animate({left:'290px'},200).animate({left:'300px'},200)});jQuery('table.table tbody.statused tr').mouseleave(function(){jQuery(this).find('.hover_stats').fadeOut('slow').animate({left:'300px'},200)})});

Quanto a sua 2° pergunta, necessitarei do seu template index_box
avatar

Slurk
Nível 10

Masculino
Inscrito dia : 23/11/2015
Mensagens : 273
Pontos Ativos : 427

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

Resolvido Re: Informações no hover

Mensagem por Luiis_. em 26/11/15, 04:57 pm

Olá Tiupkit

Aqui está o index_box

Código:
<div class="pun-crumbs">
 <p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a><strong>{NAV_CAT_DESC}</strong></p>
</div>
<div class="main">
<!-- BEGIN catrow -->
 <!-- BEGIN tablehead -->
 <div class="main-head">
 <div class="page-title">{catrow.tablehead.L_FORUM}</div>
 </div>
 <div class="main-content">
 <table cellspacing="0" class="table">
 <tbody class="statused">
 <!-- END tablehead -->

 <!-- BEGIN forumrow -->
 <tr>
 <td class="tcl" style="padding-right: {catrow.forumrow.INC_LEVEL_RIGHT}; padding-left: {catrow.forumrow.INC_LEVEL_LEFT};">
 <span class="status" style="margin-right: -{catrow.forumrow.INC_WIDTH_ICON}; margin-left: -{catrow.forumrow.INC_WIDTH_ICON};">
 <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
 </span>
 <h{catrow.forumrow.LEVEL} class="hierarchy"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}>
 <br />
 {catrow.forumrow.FORUM_DESC}
 <!-- BEGIN switch_moderators_links -->
 <br />
 {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
 <!-- END switch_moderators_links -->
 {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
 <strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
 </td>
 <td class="tc2"></td>
                                                <td class="tc3 col_stats">{catrow.forumrow.TOPICS} tópicos<br />{catrow.forumrow.POSTS} respostas</td>
 <td class="tcr">
 <span>
 <!-- BEGIN switch_topic_title -->
 <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
 <!-- END switch_topic_title -->
 {catrow.forumrow.USER_LAST_POST}
 </span>
 </td>
 </tr>
 <!-- END forumrow -->

 <!-- BEGIN tablefoot -->
 </tbody>
 </table>
 </div>
 <!-- END tablefoot -->
<!-- END catrow -->
</div>

<!-- BEGIN switch_on_index -->
<div class="main-box clearfix">
 <ul>
 <li><a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a></li>
 <li><a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a></li>
 <li><a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a></li>
 </ul>
 <!-- BEGIN switch_delete_cookies -->
 <p class="right">
 <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
 </p>
 <!-- END switch_delete_cookies -->
</div>
<!-- END switch_on_index -->

O Codigo que você me passou não feiz nenhum efeito
avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por Fraise em 26/11/15, 11:55 pm

Olá @Luiis_.,

De acordo com o ponto 6 do "Sub-Fóruns de atendimento" do regulamento do setor de suporte, só é permitida uma dúvida por tópico:
Seta Só é permitida uma dúvida por tópico nas seções, se houver dúvidas diferentes crie novos tópicos.

Pedimos que re-leia o nosso regulamento para evitar futuras penalizações.
Mais lhe informo que, o suporte ao seu tópico já não é limitado, porque a ilegalidade já foi corrigida, agradecemos imenso a sua colaboração.

Quanto à sua questão, poderia dizer-nos se está resolvida? É que aqui está tudo okay:

Seta http://i.imgur.com/0SZv4F5.png

Com os melhores cumprimentos.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5020
Pontos Ativos : 6700

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Informações no hover

Mensagem por Slurk em 27/11/15, 12:10 am

Perdão a demora senhor, agora que cheguei em casa,

Substitua seu template index_box por este:

Código:
<div class="pun-crumbs">
 <p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a><strong>{NAV_CAT_DESC}</strong></p>
</div>
<div class="main">
<!-- BEGIN catrow -->
 <!-- BEGIN tablehead -->
 <div class="main-head">
 <div class="page-title">{catrow.tablehead.L_FORUM}</div>
 </div>
 <div class="main-content">
 <table cellspacing="0" class="table">
 <tbody class="statused">
 <!-- END tablehead -->

 <!-- BEGIN forumrow -->
 <tr>
 <td class="tcl" style="padding-right: {catrow.forumrow.INC_LEVEL_RIGHT}; padding-left: {catrow.forumrow.INC_LEVEL_LEFT};">
 <span class="status" style="margin-right: -{catrow.forumrow.INC_WIDTH_ICON}; margin-left: -{catrow.forumrow.INC_WIDTH_ICON};">
 <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
 </span>
 <h{catrow.forumrow.LEVEL} class="hierarchy"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}>
 <br />
 {catrow.forumrow.FORUM_DESC}
 <!-- BEGIN switch_moderators_links -->
 <br />
 {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
 <!-- END switch_moderators_links -->
 {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
 <strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
 </td>
 <td class="tc2"></td>
 
 <td class="tcr">
 <span>
 <!-- BEGIN switch_topic_title -->
 <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
 <!-- END switch_topic_title -->
 {catrow.forumrow.USER_LAST_POST}
 </span>
 </td>
 </tr>
 <!-- END forumrow -->

 <!-- BEGIN tablefoot -->
 </tbody>
 </table>
 </div>
 <!-- END tablefoot -->
<!-- END catrow -->
</div>

<!-- BEGIN switch_on_index -->
<div class="main-box clearfix">
 <ul>
 <li><a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a></li>
 <li><a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a></li>
 <li><a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a></li>
 </ul>
 <!-- BEGIN switch_delete_cookies -->
 <p class="right">
 <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
 </p>
 <!-- END switch_delete_cookies -->
</div>
<!-- END switch_on_index -->
avatar

Slurk
Nível 10

Masculino
Inscrito dia : 23/11/2015
Mensagens : 273
Pontos Ativos : 427

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

Resolvido Re: Informações no hover

Mensagem por Luiis_. em 27/11/15, 04:19 pm

Fiz uns negocio e saiu o q eu queria vlw pessoal mt obrigado pela ajuda
avatar

Luiis_.
Nível 8

Masculino
Inscrito dia : 12/07/2015
Mensagens : 123
Pontos Ativos : 198

Ver perfil do usuário http://...

Resolvido Re: Informações no hover

Mensagem por MateusAnjosV em 28/11/15, 05:57 pm

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1434
Pontos Ativos : 2008

Ver perfil do usuário http://ajuda.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