ArtigosMostrar quantidade de tópicos e respostas apenas quando passa o mouse.
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por Sonic_BR 22.10.14 2:02
Olá pessoal!
Eu queria saber se tem como fazer com que a quantidade dos tópicos e respostas apareça apenas quando o mouse está encima dele (não exatamente encima do nome, mas da caixa onde mostra o titulo, a descrição do tópico, etc). Se possível, quero isso na página principal (as categorias) e nos forums (a lista de tópicos)!
Eu tô falando disso ó:
Valeu!
Eu queria saber se tem como fazer com que a quantidade dos tópicos e respostas apareça apenas quando o mouse está encima dele (não exatamente encima do nome, mas da caixa onde mostra o titulo, a descrição do tópico, etc). Se possível, quero isso na página principal (as categorias) e nos forums (a lista de tópicos)!
Eu tô falando disso ó:
Valeu!
Última edição por Sonic_BR em 22.10.14 15:36, editado 1 vez(es)
Sonic_BR- **
- Membro desde : 13/09/2014
Mensagens : 62
Pontos : 105 -
Re: Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por Daemon 22.10.14 2:06
Peço que deixe aqui o seu template "index_box" para a edição do mesmo.
Até!
Até!
Daemon- Super Membro
- Membro desde : 02/03/2012
Mensagens : 1132
Pontos : 1825 -
Re: Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por Sonic_BR 22.10.14 2:13
Tá rápido ein Daemon, ehaueha!
Vou colocar o topic_list_box também, pra você colocar o mesmo efeito, se puder, é claro o/
index_box:
topics_list_box
Flw o/
Vou colocar o topic_list_box também, pra você colocar o mesmo efeito, se puder, é claro o/
index_box:
- Spoiler:
- Código:
<div class="pun-crumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<p class="crumbs"><a href="{U_INDEX}" itemprop="url"><span itemprop="title">{L_INDEX}</span></a><strong>{NAV_CAT_DESC}</strong></p>
</div>
<div class="main">
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<div class="main-head" style="border-top-left-radius: 15px; border-top-right-radius: 15px;">
<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 style="background: white !important;">
<td class="tcl" style="padding-right: {catrow.forumrow.INC_LEVEL_RIGHT}; padding-left: {catrow.forumrow.INC_LEVEL_LEFT}; background: transparent !important;">
<span class="status" style="margin-right: -{catrow.forumrow.INC_WIDTH_ICON}; margin-left: -{catrow.forumrow.INC_WIDTH_ICON}; margin-top: 8px;">
<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" style="font-size: 1.2em;"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}>
<br />
{catrow.forumrow.FORUM_DESC}
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
<strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
</td>
<td class="tc3" style="font: -webkit-mini-control; font-size: 11px; color: rgb(86, 86, 86); text-shadow: 0px 0px 5px rgba(26, 255, 0, 0.26); padding-left: 50px; background: transparent !important;"><span id="stats_do_forum"><b>{catrow.forumrow.TOPICS}</b> Tópicos<br><b>{catrow.forumrow.POSTS}</b><span/> Respostas</td>
<td class="tcr" style="padding-left: 90px !important; background: transparent !important;">
<!-- BEGIN avatar -->
<span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
<!-- END avatar -->
<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 -->
topics_list_box
- Spoiler:
- Código:
<!-- BEGIN topics_list_box -->
<!-- BEGIN row -->
<!-- BEGIN header_table -->
<!-- BEGIN multi_selection -->
<script type="text/javascript">
function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
var all_checked = true;
for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
}
}
document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
}
function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
}
}
}
</script>
<!-- END multi_selection -->
<div class="main-head">
<!-- BEGIN multi_selection -->
<input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
<!-- END multi_selection -->
<h1 class="page-title">Tópicos Importantes</h1>
</div>
<div class="main-content" style="border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;">
<table cellspacing="0" class="table">
<tbody class="statused">
<!-- END header_table -->
<!-- BEGIN header_row -->
<strong>{topics_list_box.row.L_TITLE}</strong>
<!-- END header_row -->
<!-- BEGIN topic -->
<!-- BEGIN table_sticky -->
</tbody>
</table>
</div>
<div class="main-head" style="border-top-left-radius: 15px; border-top-right-radius: 15px;">
<!-- BEGIN multi_selection -->
<input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" / >
<!-- END multi_selection -->
<h1 style="color: #FFF; font-size: 18px; text-align: center; text-shadow: rgba(255,255,255,0.31) 0 0 5px; font-weight: bold;">Tópicos</h1>
</div>
<div class="main-content">
<table cellspacing="0" class="table">
<tbody class="statused">
<!-- END table_sticky -->
<tr style="background-color: transparent; height: 66px !important;">
<td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->" style="background: transparent;">
<span class="status" style="margin-top: 10px; margin-left: -29px;">
<img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
</span>
<!-- BEGIN single_selection -->
<input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />
<!-- END single_selection -->
{topics_list_box.row.NEWEST_POST_IMG}
{topics_list_box.row.TOPIC_TYPE}
<h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}" style="color: #000000">{topics_list_box.row.TOPIC_TITLE}</a></h2>
{topics_list_box.row.GOTO_PAGE_NEW}
<br>
<p style="font-size: 10px; position: absolute;">Por {topics_list_box.row.TOPIC_AUTHOR}</p>
<!-- BEGIN switch_description -->
<br />
<p style="color: #777777">{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION} </p>
<!-- END switch_description -->
</td>
<td class="tc2" style="background-color: transparent; font: -webkit-mini-control; font-size: 11px; color: rgb(86, 86, 86); text-shadow: 0px 0px 5px rgba(26, 255, 0, 0.26); padding-left: 50px !important; position: absolute !important; padding-top: 17px;">
<b>{topics_list_box.row.REPLIES}</b> Respostas<br><b>{topics_list_box.row.VIEWS}</b> Visualizações
<td/>
<td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->" style="padding-left: 35px !important; background: transparent;">
<!-- BEGIN avatar -->
<span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
<!-- END avatar -->
Última resposta por {topics_list_box.row.LAST_POST_AUTHOR} <br>{topics_list_box.row.LAST_POST_TIME} {topics_list_box.row.LAST_POST_IMG}
</td>
<!-- BEGIN multi_selection -->
<td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
<!-- END multi_selection -->
</tr>
<!-- END topic -->
<!-- BEGIN no_topics -->
<tr>
<td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
</tr>
<!-- END no_topics -->
<!-- BEGIN bottom -->
</tbody>
</table>
</div>
<div class="main-foot clearfix">
<!-- BEGIN multi_selection -->
<input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
<!-- END multi_selection -->
<p class="h2" style="margin-top: 3px; font-style: italic; color: black;">Existem atualmente <b>{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}</b> tópicos neste fórum.</p>
<p class="options">
<a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a> {S_WATCH_FORUM} <a href="#top">{L_BACK_TO_TOP}</a>
</p>
</div>
<!-- END bottom -->
<!-- BEGIN spacer --><br /><!-- END spacer -->
<!-- END row -->
<!-- END topics_list_box -->
Flw o/
Sonic_BR- **
- Membro desde : 13/09/2014
Mensagens : 62
Pontos : 105 -
Re: Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por [F]lames 22.10.14 12:50
Olá,
Peço que tente apenas adicionar isso em sua Folha de Estilos CSS:
Passar bem!
Peço que tente apenas adicionar isso em sua Folha de Estilos CSS:
- Código:
/* Hover nas categorias */
.pun table.table td.tc3 {
opacity: 0;
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
-o-transition: opacity .5s;
transition: opacity .5s;
}
.pun table.table tr:hover td.tc3 {
opacity: 1;
}
Passar bem!
![[F]lames](https://2img.net/h/oi43.tinypic.com/28quglc.png)
[F]lames- Membro
- Membro desde : 05/10/2012
Mensagens : 866
Pontos : 1208 -
Re: Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por Sonic_BR 22.10.14 15:36
Flames! Fuincionou direitinho cara, brigado mesmo 
Toma biscoito pra você também
Resolvido.
EDIT:
Ei, mas não funciona na lista de tópicos de cada categoria!
Comofas? D:
Toma biscoito pra você também
- Spoiler:
Resolvido.
EDIT:
Ei, mas não funciona na lista de tópicos de cada categoria!
Comofas? D:
Sonic_BR- **
- Membro desde : 13/09/2014
Mensagens : 62
Pontos : 105 -
Re: Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por [F]lames 22.10.14 23:55
Olá,
Em meu PC está funcionando normalmente, tanto no início do fórum quanto dentro de uma categoria, experimente teclar CTRL + F5 e veja se resolve.
Passar bem!
Em meu PC está funcionando normalmente, tanto no início do fórum quanto dentro de uma categoria, experimente teclar CTRL + F5 e veja se resolve.
Passar bem!
[F]lames- Membro
- Membro desde : 05/10/2012
Mensagens : 866
Pontos : 1208 -
Re: Mostrar quantidade de tópicos e respostas apenas quando passa o mouse.
por Sonic_BR 23.10.14 2:39
Flames, eu já arrumei isso, só esqueci de postar aqui no tópico, euaehuehaueah!
Foi mal mesmo :v
No mais, toma um biscoitinho...
Resolvido.
Foi mal mesmo :v
No mais, toma um biscoitinho...
- Spoiler:
Resolvido.
Sonic_BR- **
- Membro desde : 13/09/2014
Mensagens : 62
Pontos : 105 -
Tópicos semelhantes» Visualização quantidade tópicos/respostas
» Efeito quando passa mouse nas imagens dos tópicos
» Mostrar menagens e tópicos ao passar o mouse
» Como configurar a quantidade de respostas por página?
» Queria coloca essas bordas ao redor das ultimas respostas e na quantidade de vistos
» Efeito quando passa mouse nas imagens dos tópicos
» Mostrar menagens e tópicos ao passar o mouse
» Como configurar a quantidade de respostas por página?
» Queria coloca essas bordas ao redor das ultimas respostas e na quantidade de vistos
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos