Botão exibir perfil
4 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Botão exibir perfil
Detalhes da questão
Endereço do fórum: http://narutosurvivalgold.forumeiros.com/
Versão do fórum: phpBB3
Descrição
Olá, após migrar meu fórum para um endereço novo, tive alguns problemas de códigos e estruturas no novo fórum. Um deles foi o botão de exibir perfil que simplesmente sumiu de onde deveria ficar (abaixo do avatar nos tópicos). O código que eu usava até então era esse:
- Código:
(function ($) {
'use strict';
$(function () {
$('.fa-show-hidden-profile').on('click', function () {
var $trigger = $(this);
$trigger
.parents('.postprofile')
.find('.fa-hidden-profile')
.stop()
.fadeToggle()
;
});
$('.fa-hidden-profile')
.on('click', function () {
$(this)
.stop()
.fadeToggle()
;
})
;
});
}(jQuery));
Ele deveria ficar dessa maneira:
...mas está assim:
Alguém pode me ajudar?
OBS: Para se registrar no fórum é preciso aguardar minha ativação de administrador. Então se for preciso se registrar favor me avisar para que eu possa ativar o usuário.
Re: Botão exibir perfil
Olá @BichodoMato,
Aceda a Painel de Controle >> Visualização >> Templates >> Geral e procure pelo template viewtopic_body. Nesse template, procure por:
E substitua por:
Em seguida, aceda a Painel de Controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScript e crie um novo JavaScript com o investimento marcado Nos tópicos, utilizando este código:
Por último, aceda a Painel de Controle >> Visualização >> Imagens & Cores >> Cores >> Folha de estilo CSS e adicione este código:
Atenciosamente,
Fraise.
Aceda a Painel de Controle >> Visualização >> Templates >> Geral e procure pelo template viewtopic_body. Nesse template, procure por:
- Código:
<span class="postdetails poster-profile">
{postrow.displayed.POSTER_RANK}<br />
{postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br />
<!-- BEGIN profile_field -->
{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->
{postrow.displayed.POSTER_RPG}
</span>
E substitua por:
- Código:
<span class="postdetails poster-profile">
{postrow.displayed.POSTER_RANK}<br />
{postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br />
<div class="toggle-trig"><a href="#">Toggle user info</a></div>
<div class="kari">
<!-- BEGIN profile_field -->
{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->
{postrow.displayed.POSTER_RPG}
</div>
</span>
Em seguida, aceda a Painel de Controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScript e crie um novo JavaScript com o investimento marcado Nos tópicos, utilizando este código:
- Código:
jQuery(document).ready(function(){
jQuery(".toggle-trig a").click(function () {
jQuery(this).parent().next().slideToggle("normal");
return false;
});
});
Por último, aceda a Painel de Controle >> Visualização >> Imagens & Cores >> Cores >> Folha de estilo CSS e adicione este código:
- Código:
.toggle-trig{text-align:left;}
.kari{display: none;}
.toggle-trig a:hover{text-decoration: none;}
Atenciosamente,
Fraise.
Re: Botão exibir perfil
Olá!
Deu ruim... o avatar duplicou e apareceu embaixo do outro.
Eu fui procurar o code que você me pediu nos templates e achei ele, mas num padrão diferente. Aqui meu view_topic inteiro:
Talvez eu tenha colocado ele de maneira errada, não sei, eu considerei os "span" como os "dd" e foi aí que nada deu certo. Se puder me orientar no que devo proceder aí exatamente...
Deu ruim... o avatar duplicou e apareceu embaixo do outro.
Eu fui procurar o code que você me pediu nos templates e achei ele, mas num padrão diferente. Aqui meu view_topic inteiro:
- Código:
<script type="text/javascript">
//<![CDATA[
var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on =
'{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}
addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}",
email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites:
"{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };
$(function(){
if(typeof(_atc) == "undefined") {
_atc = { };
}
});
var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}',
hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
showHiddenMessage = function(id)
{
try
{
var regId = parseInt(id, 10);
if( isNaN(regId) ) { regId = 0; }
if( regId > 0)
{
$('.post--' + id).toggle(0, function()
{
if( $(this).is(":visible") )
{
$('#hidden-title--' + id).html
(hiddenMsgLabel.visible);
}
else
{
$('#hidden-title--' + id).html
(hiddenMsgLabel.hidden);
}
});
}
}
catch(e) { }
return false;
};
//]]>
</script>
<h1 class="page-title">
<a href="{TOPIC_URL}">{TOPIC_TITLE}</a>
</h1>
<div class="topic-actions">
<div class="buttons">
<!-- BEGIN switch_user_authpost -->
<a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}"
class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a>
<!-- END switch_user_authpost -->
<!-- BEGIN switch_user_authreply -->
<a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply"
alt="{L_POST_REPLY_TOPIC}" /></a>
<!-- END switch_user_authreply -->
</div>
<div class="pathname-box">
<p>
<a class="nav" href="{U_INDEX}"><span>{L_INDEX}</span></a>
<!--{NAV_SEP}<a class="nav" href="{U_ALBUM}"><span>{L_ALBUM}</span></a>-->
{NAV_CAT_DESC}
</p>
</div>
<p class="right">
<!-- BEGIN switch_twitter_btn -->
<span>
<a href="https://twitter.com/share" class="twitter-share-button" data-
via="{TWITTER}">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)
[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id))
{js=d.createElement(s);js.id=id;js.src=p
+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document,
'script', 'twitter-wjs');</script>
</span>
<!-- END switch_twitter_btn -->
<!-- BEGIN switch_fb_likebtn -->
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/{LANGUAGE}/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span class="fb-like" data-href="{FORUM_URL}{TOPIC_URL}" data-
layout="button_count" data-action="like" data-show-faces="false" data-
share="false"></span>
<!-- END switch_fb_likebtn -->
</p>
<div class="pagination">
{PAGE_NUMBER}
•
<a class="addthis_button" href="#">{L_SHARE}</a>
<!-- BEGIN switch_plus_menu -->
•
<script type="text/javascript">//<![CDATA[
var url_favourite = '{U_FAVOURITE_JS_PLUS_MENU}';
var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
insert_plus_menu_new('f{FORUM_ID}&t=
{TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
//]]>
</script>
<!-- END switch_plus_menu -->
</div>
<div class="clear"></div>
</div>
<!-- BEGIN topicpagination -->
<p class="pagination">{PAGINATION}</p>
<!-- END topicpagination -->
<p class="left-box">
<!-- BEGIN switch_isconnect -->
<a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a
href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>
<!-- END switch_isconnect -->
<a href="#bottom">{L_GOTO_DOWN}</a>
</p>
<div class="clear"></div>
{POLL_DISPLAY}
<!-- BEGIN postrow -->
<!-- BEGIN hidden -->
<div class="post {postrow.hidden.ROW_COUNT}">
<div class="inner">
<span class="corners-top"><span></span></span>
<p style="text-align:center">{postrow.hidden.MESSAGE}
</p>
<div class="clear"></div>
<span class="corners-bottom"><span></span></span>
</div>
</div>
<!-- END hidden -->
<!-- BEGIN displayed -->
<div id="p{postrow.displayed.U_POST_ID}" class="post
{postrow.displayed.ROW_COUNT}{postrow.displayed.ONLINE_IMG_NEW} post--
{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR}
style="{postrow.displayed.DISPLAYABLE_STATE}">
<div class="inner">
<div id="content-title-topic">
<h2 class="topic-title">
{postrow.displayed.ICON}<a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a>
</h2>
<p class="author">
<img src="{postrow.displayed.MINI_POST_IMG}" alt="{postrow.displayed.L_MINI_POST_ALT}" title="{postrow.displayed.L_MINI_POST_ALT}" />
{L_TOPIC_BY}
{postrow.displayed.POSTER_NAME} {postrow.displayed.POST_DATE_NEW}</p>
</div>
<div style="position: relative; top: -30px; width: 1px;"
id="{postrow.displayed.U_POST_ID}"></div>
<div class="postbody">
<ul class="profile-icons">
<li>{postrow.displayed.THANK_IMG}</li>
<li>{postrow.displayed.MULTIQUOTE_IMG}</li>
<li>{postrow.displayed.QUOTE_IMG}</li>
<li>{postrow.displayed.EDIT_IMG}</li>
<li>{postrow.displayed.DELETE_IMG}</li>
<li>{postrow.displayed.IP_IMG}</li>
<li>{postrow.displayed.REPORT_IMG_NEW}</li>
</ul>
<div class="clearfix"></div>
<!-- BEGIN switch_vote_active -->
<div class="vote gensmall">
<!-- BEGIN switch_vote -->
<div class="vote-button"><a
href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>
<!-- END switch_vote -->
<!-- BEGIN switch_bar -->
<div class="vote-bar"
title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
<!-- BEGIN switch_vote_plus -->
<div class="vote-bar-plus"
style="height:
{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}
px;"></div>
<!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus -->
<div class="vote-bar-minus"
style="height:
{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}
px;"></div>
<!-- END switch_vote_minus -->
</div>
<!-- END switch_bar -->
<!-- BEGIN switch_no_bar -->
<div
title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----
</div>
<!-- END switch_no_bar -->
<!-- BEGIN switch_vote -->
<div class="vote-button"><a
href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div>
<!-- END switch_vote -->
</div>
<!-- END switch_vote_active -->
<div style="display:none"></div>
<div class="content clearfix">
<div>{postrow.displayed.MESSAGE}</div>
<!-- BEGIN switch_attachments -->
<dl class="attachbox">
<dt>
{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
<dd class="attachments">
<dl class="file
clearfix">
<dt>
<img
src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt=""/>
</dt>
<dd>
<!-- BEGIN switch_dl_att -->
<span><a class="postlink"
href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_AT
TACHMENT}">
{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT
}</a>
{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT
_DEL}</span>
<!-- END switch_dl_att -->
<!-- BEGIN switch_no_dl_att -->
<span>
{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHM
ENT}
{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHM
ENT_DEL}</span>
<!-- END switch_no_dl_att -->
<!-- BEGIN switch_no_comment -->
<span>
{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACH
MENT_COMMENT}</span>
<!-- END switch_no_comment -->
<!-- BEGIN switch_no_dl_att -->
<span><strong>
{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO
_DL}</strong></span>
<!-- END switch_no_dl_att -->
<span>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE})
{postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</span>
</dd>
</dl>
</dd>
</dl>
<!-- END switch_attachments -->
</div>
{postrow.displayed.EDITED_MESSAGE}
<!-- BEGIN switch_signature -->
<div class="signature_div" id="sig
{postrow.displayed.U_POST_ID}">{postrow.displayed.SIGNATURE_NEW}</div>
<!-- END switch_signature -->
</div>
<div class="postprofile" id="profile
{postrow.displayed.U_POST_ID}">
<!-- div class="online2"></div-->
<dl>
<strong class="named_ply" style="font-
size:1.2em">{postrow.displayed.POSTER_NAME}</strong>
<dt>
{postrow.displayed.POSTER_AVATAR}
<br />
</dt>
<dd>{postrow.displayed.POSTER_RANK_NEW}
{postrow.displayed.RANK_IMAGE}</dd>
<dd><br /></dd>
<dd>
<!-- BEGIN profile_field -->
{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}
{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->
{postrow.displayed.POSTER_RPG}
</dd>
<dd><br /></dd>
<dd>
{postrow.displayed.PROFILE_IMG}
{postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field -->
{postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->
</dd>
</dl>
</div>
<div class="clear"></div>
<p class="right"><a href="#top">{L_BACK_TO_TOP}</a> <a
href="#bottom">{L_GOTO_DOWN}</a></p>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- BEGIN first_post_br -->
<hr id="first-post-br" />
<!-- END first_post_br -->
<!-- END displayed -->
<!-- END postrow -->
<a name="bottomtitle"></a>
<!-- BEGIN topicpagination -->
<p class="pagination">{PAGINATION}</p>
<!-- END topicpagination -->
<p class="left-box">
<!-- BEGIN switch_isconnect -->
<a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a
href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>
<!-- END switch_isconnect -->
<a href="#top">{L_BACK_TO_TOP}</a>
</p>
<div class="clear"></div>
<div class="noprint">
<!-- BEGIN switch_user_logged_in -->
<!-- BEGIN watchtopic -->
<p class="right">{S_WATCH_TOPIC}</p>
<!-- END watchtopic -->
<!-- END switch_user_logged_in -->
</div>
<!-- BEGIN promot_trafic -->
<div class="post row2" id="ptrafic_close" style="display:none;font-size:1.3em;line-
height:1.4em">
<span class="corners-top"><span></span></span>
<span class="gensmall"><a href="javascript:ShowHideLayer
('ptrafic_open','ptrafic_close');"><img src="{TABS_MORE_IMG}" alt="+" align=""
border="0" /></a></span>
<span class="ptrafic"> {PROMOT_TRAFIC_TITLE}</span>
<span class="corners-bottom"><span></span></span>
</div>
<div class="post row2" id="ptrafic_open" style="display:'';font-size:1.3em;line-
height:1.4em">
<span class="corners-top"><span></span></span>
<span class="gensmall"><a href="javascript:ShowHideLayer
('ptrafic_open','ptrafic_close');"><img src="{TABS_LESS_IMG}" alt="-" align=""
border="0" /></a></span>
<span class="ptrafic"> {PROMOT_TRAFIC_TITLE}</span>
<div class="clear"></div>
<div>
<!-- BEGIN link -->
» <a href="{promot_trafic.link.U_HREF}" target="_blank"
title="{promot_trafic.link.TITLE}" rel="nofollow">{promot_trafic.link.TITLE}</a><br />
<!-- END link -->
</div>
<span class="corners-bottom"><span></span></span>
</div>
<!-- END promot_trafic -->
<!-- BEGIN switch_forum_rules -->
<div class="post row1" id="forum_rules">
<span class="corners-top"><span></span></span>
<div class="h3"> {L_FORUM_RULES}</div>
<div class="clear"></div>
<table class="postbody">
<tr>
<!-- BEGIN switch_forum_rule_image -->
<td class="logo">
<img src="{RULE_IMG_URL}" alt="" />
</td>
<!-- END switch_forum_rule_image -->
<td class="rules content">
{RULE_MSG}
</td>
</tr>
</table>
<span class="corners-bottom"><span></span></span>
</div>
<!-- END switch_forum_rules -->
<!-- BEGIN switch_user_logged_in -->
<a name="quickreply"></a>
{QUICK_REPLY_FORM}
<!-- END switch_user_logged_in -->
<hr />
<div class="topic-actions">
<div class="buttons">
<!-- BEGIN switch_user_authpost -->
<a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}"
class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a>
<!-- END switch_user_authpost -->
<!-- BEGIN switch_user_authreply -->
<a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply"
alt="{L_POST_REPLY_TOPIC}" /></a>
<!-- END switch_user_authreply -->
</div>
<div class="pathname-box">
<p><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a
class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC}</p>
</div>
<div class="pagination">
{PAGE_NUMBER}
</div>
</div>
<div class="clear"></div>
<form action="{S_JUMPBOX_ACTION}" method="get" onsubmit="if(document.jumpbox.f.value
== -1){return false;}">
<fieldset class="jumpbox">
<label>{L_JUMP_TO}: </label>
{S_JUMPBOX_SELECT}
<input class="button2" type="submit" value="{L_GO}" />
</fieldset>
</form>
<!-- BEGIN viewtopic_bottom -->
<form method="get" action="{S_FORM_MOD_ACTION}">
<fieldset class="quickmod">
<input type="hidden" name="t" value="{TOPIC_ID}" />
<!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
<input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />
<label>{L_MOD_TOOLS}: </label>
{S_SELECT_MOD}
<input class="button2" type="submit" value="{L_GO}" />
</fieldset>
</form>
<div class="clear"></div>
<p class="right">{S_TOPIC_ADMIN}</p>
<!-- END viewtopic_bottom -->
<!-- BEGIN show_permissions -->
<div class="h3">{L_TABS_PERMISSIONS}</div>
{S_AUTH_LIST}
<!-- END show_permissions -->
<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.postbody .content', 'max_width' :
{switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' :
{switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->
<script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion"
type="text/javascript"></script>
Talvez eu tenha colocado ele de maneira errada, não sei, eu considerei os "span" como os "dd" e foi aí que nada deu certo. Se puder me orientar no que devo proceder aí exatamente...
Re: Botão exibir perfil
Hi.
Exclua todos os passos e adicione somente esse js:
Exclua todos os passos e adicione somente esse js:
- Código:
$(function(){
$('.post').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var username = t.find('.postprofile > dl > dt > strong').html();
var ranktext = t.find('.postprofile > dl > dd:nth-child(2)').html();
var perfil = t.find('.postprofile > dl > dd:nth-child(4)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(6)').html();
var todos = username + "<br>" + ranktext + "<br>" + perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(4), .postprofile > dl > dt > strong, .postprofile > dl > dd:nth-child(3), .postprofile > dl > dd:nth-child(4), .postprofile > dl > dd:nth-child(2), .postprofile > dl > dd:nth-child(6)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile > dl').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.exibirperfil').click(function(){
$('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border-bottom': '5px solid yellow',
'border-bottom': '5px solid yellow',
'max-width' : '80%',
'background' : '#a7a4a466',
'padding' : '10px',
'font-size' : '15px',
'text-align' : 'center',
'font-weight' : 'bold',
'text-transform': 'uppercase',
'color' : 'gray',
'margin-left' : '5%',
'cursor' : 'pointer'
});
$('.postprofile > dl').css({
'padding' : '10px'
});
$('.showpostprofile').css({
'z-index' : '55',
'position' : 'absolute',
'top' : '20%',
'left' : '-200%',
'background' : '#dddbdb',
'padding' : '15px',
'border-radius': '5px',
'text-align' : 'center',
'display' : 'none'
});
});
Re: Botão exibir perfil
Substitui por:
Espero que saiba modificar, mas, caso não, estarei aqui.
Se quiser mudar a posição da janela, aumente ou diminua os valores:
- Código:
$(function({
$('.post, .postrow1, .postrow2, .postrow3').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var perfil = t.find('.postprofile > dl > dd:nth-child(5)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(7)').html();
var todos = perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile > dl > dt').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.postprofile > dl > div.exibirperfil').click(function(){
$('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border-bottom': '5px solid yellow', //remova essa linha para retirar a borda
'max-width' : '80%', //tamanho do botão
'background' : '#a7a4a466', //cordefundodobotão
'padding' : '10px', //distância da margem
'font-size' : '15px', //tamanho da fonte
'text-align' : 'center', //alinhamento do texto
'font-weight' : 'bold', //manter o texto em negrito
'text-transform': 'uppercase', // manter o texto em maiusculo
'color' : 'gray', // cor do texto
'margin-left' : '5%', //distância da margem esquerda
'cursor' : 'pointer' // cursor que é exibido ao passar o mouse
});
$('.postprofile > dl').css({
'padding' : '10px'
});
$('.showpostprofile').css({
'z-index' : '55',
'position' : 'absolute',
'top' : '5%',
'left' : '-20%',
'background' : '#dddbdb',
'padding' : '15px',
'border-radius': '5px',
'text-align' : 'center',
'display' : 'none'
});
});
Espero que saiba modificar, mas, caso não, estarei aqui.
Se quiser mudar a posição da janela, aumente ou diminua os valores:
- Código:
'top' : '5%',
'left' : '-20%',
Re: Botão exibir perfil
Estranho... olha:
http://prntscr.com/jcgbwk
Será que você pode deixar ele ativo já que não influencia em nada?
Não encontrei ele aqui: http://narutosurvivalgold.forumeiros.com/99694.js
- Edit -
Se já tiver ativo: tens muitos javascripts? Conseguiria desabilitá-los e testar o js sem interrupções? É que, o problema já não está no código.
E, seu fórum tem alguns erros:
http://prntscr.com/jcgelg
http://prntscr.com/jcgbwk
Será que você pode deixar ele ativo já que não influencia em nada?
Não encontrei ele aqui: http://narutosurvivalgold.forumeiros.com/99694.js
- Edit -
Se já tiver ativo: tens muitos javascripts? Conseguiria desabilitá-los e testar o js sem interrupções? É que, o problema já não está no código.
E, seu fórum tem alguns erros:
http://prntscr.com/jcgelg
Re: Botão exibir perfil
Bom, ele até está ativo mas continua sem aparecer. É realmente estranho porque também estou usando o Google Chrome (que acredito que esteja usando também, dado o ícone abaixo do seu avatar).
Eu também já tinha feito isso de desabilitar os JS e testar ativando um por um, mas continuou dando em nada. Até achei que fosse alguma opção desabilitada no painel mas não encontrei nada que pudesse influenciar. Será que estou adicionando algo errado então?
Confere comigo: https://prnt.sc/jcgyhp
Ps: Agradeço por achar mais erros, apesar de que eu não sei resolvê-los e.e
Eu também já tinha feito isso de desabilitar os JS e testar ativando um por um, mas continuou dando em nada. Até achei que fosse alguma opção desabilitada no painel mas não encontrei nada que pudesse influenciar. Será que estou adicionando algo errado então?
Confere comigo: https://prnt.sc/jcgyhp
Ps: Agradeço por achar mais erros, apesar de que eu não sei resolvê-los e.e
Re: Botão exibir perfil
Eu esqueci de um ). ;-;
Perdão! Substitui por:
E se quiser usar a versão minificada:
Perdão! Substitui por:
- Código:
$(function(){
$('.post, .postrow1, .postrow2, .postrow3').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var perfil = t.find('.postprofile > dl > dd:nth-child(5)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(7)').html();
var todos = perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile > dl > dt').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.postprofile > dl > div.exibirperfil').click(function(){
$('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border-bottom': '5px solid yellow', //remova essa linha para retirar a borda
'max-width' : '80%', //tamanho do botão
'background' : '#a7a4a466', //cordefundodobotão
'padding' : '10px', //distância da margem
'font-size' : '15px', //tamanho da fonte
'text-align' : 'center', //alinhamento do texto
'font-weight' : 'bold', //manter o texto em negrito
'text-transform': 'uppercase', // manter o texto em maiusculo
'color' : 'gray', // cor do texto
'margin-left' : '5%', //distância da margem esquerda
'cursor' : 'pointer' // cursor que é exibido ao passar o mouse
});
$('.postprofile > dl').css({
'padding' : '10px'
});
$('.showpostprofile').css({
'z-index' : '55',
'position' : 'absolute',
'top' : '5%',
'left' : '-20%',
'background' : '#dddbdb',
'padding' : '15px',
'border-radius': '5px',
'text-align' : 'center',
'display' : 'none'
});
});
E se quiser usar a versão minificada:
- Código:
$(function(){$(".post, .postrow1, .postrow2, .postrow3").each(function(){var o=$(this);console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');var i=o.find(".postprofile > dl > dd:nth-child(5)").html()+"<br>"+o.find(".postprofile > dl > dd:nth-child(7)").html()+"<br>";o.find(".postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)").remove(),o.find(".postprofile > dl > dt").after('<div class="exibirperfil">Exibir perfil</div>'),o.find(".postprofile > dl > dt").after('<div class="showpostprofile">'+i+"</div>"),o.find(".postprofile > dl > div.exibirperfil").click(function(){$(".showpostprofile").fadeToggle()})}),$(".exibirperfil").css({"border-bottom":"5px solid yellow","max-width":"80%",background:"#a7a4a466",padding:"10px","font-size":"15px","text-align":"center","font-weight":"bold","text-transform":"uppercase",color:"gray","margin-left":"5%",cursor:"pointer"}),$(".postprofile > dl").css({padding:"10px"}),$(".showpostprofile").css({"z-index":"55",position:"absolute",top:"5%",left:"-20%",background:"#dddbdb",padding:"15px","border-radius":"5px","text-align":"center",display:"none"})});
Re: Botão exibir perfil
Beleza! Agora tá funcionando
Eu fiz alguns ajustes para deixar a aparência como queria, mas não consegui ajeitar a janela que aparece quando você clica no botão. Na verdade ela está oculta, independente de clicar ou não no botão.
Essas são as novas configurações dela:
E esse é o seu código com os ajustes de aparência que fiz:
Como faço para ela aparecer?
Edit: Também quero que o rank de admin apareça dentro da janela se possível
Eu fiz alguns ajustes para deixar a aparência como queria, mas não consegui ajeitar a janela que aparece quando você clica no botão. Na verdade ela está oculta, independente de clicar ou não no botão.
Essas são as novas configurações dela:
- Código:
background-color: #fff;
border-radius: 6px;
border: solid 10px #bbb;
position: absolute;
left: 110%;
padding: 10px;
font-size: 11px;
line-height: 13px;
text-align: center;
E esse é o seu código com os ajustes de aparência que fiz:
- Código:
$(function(){
$('.post, .postrow1, .postrow2, .postrow3').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var perfil = t.find('.postprofile > dl > dd:nth-child(5)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(7)').html();
var todos = perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile > dl > dt').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.postprofile > dl > div.exibirperfil').click(function(){
$('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border' : '3px double darkgreen',
'max-width' : '138px', //tamanho do botão
'background' : '#ffffff', //cordefundodobotão
'padding' : '6px', //distância da margem
'font-size' : '11px', //tamanho da fonte
'text-align' : 'center', //alinhamento do texto
'font-weight' : 'bold', //manter o texto em negrito
'text-transform': 'uppercase', // manter o texto em maiusculo
'color' : '#585858', // cor do texto
'margin-left' : '7px', //distância da margem esquerda
'margin-top' : '5px', //distância da margem superior
'cursor' : 'pointer' // cursor que é exibido ao passar o mouse
});
$('.postprofile > dl').css({
'padding' : '7px'
});
$('.showpostprofile').css({
'background-color' : '#fff',
'border-radius' : '6px',
'border' : 'solid 10px #bbb',
'position' : 'absolute',
'left' : '110%',
'padding' : '10px',
'font-size' : '11px',
'line-height' : '13px',
'text-align' : 'center',
'display': 'block'
});
});
Como faço para ela aparecer?
Edit: Também quero que o rank de admin apareça dentro da janela se possível
Re: Botão exibir perfil
Bom.... eu tive que fazer ás cegas agora, mas, testa aí:
P.S: esse código só tem o intuito de resolver o problema do showpostprofile não aparecer. Caso funcione, desative-o que irei incluir o rank na próxima resposta - eu incluiria nessa, mas talvez não seja preciso usar ajax -
- Código:
$(function(){
$('.post, .postrow1, .postrow2, .postrow3').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var perfil = t.find('.postprofile > dl > dd:nth-child(5)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(7)').html();
var todos = perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.postprofile > dl > div.exibirperfil').click(function(){
$('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border' : '3px double darkgreen',
'max-width' : '138px', //tamanho do botão
'background' : '#ffffff', //cordefundodobotão
'padding' : '6px', //distância da margem
'font-size' : '11px', //tamanho da fonte
'text-align' : 'center', //alinhamento do texto
'font-weight' : 'bold', //manter o texto em negrito
'text-transform': 'uppercase', // manter o texto em maiusculo
'color' : '#585858', // cor do texto
'margin-left' : '7px', //distância da margem esquerda
'margin-top' : '5px', //distância da margem superior
'cursor' : 'pointer' // cursor que é exibido ao passar o mouse
});
$('.postprofile > dl').css({
'padding' : '7px'
});
$('.showpostprofile').css({
'background-color' : '#fff',
'border-radius' : '6px',
'border' : 'solid 10px #bbb',
'position' : 'absolute',
'left' : '110%',
'padding' : '10px',
'font-size' : '11px',
'line-height' : '13px',
'text-align' : 'center',
'display': 'block'
});
});
P.S: esse código só tem o intuito de resolver o problema do showpostprofile não aparecer. Caso funcione, desative-o que irei incluir o rank na próxima resposta - eu incluiria nessa, mas talvez não seja preciso usar ajax -
Re: Botão exibir perfil
Troca o código por:
- Código:
$(function(){
$('.post, .postrow1, .postrow2, .postrow3').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var perfil = t.find('.postprofile > dl > dd:nth-child(5)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(7)').html();
var todos = perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.postprofile > dl > div.exibirperfil').click(function(){
t.find('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border' : '3px double darkgreen',
'max-width' : '138px', //tamanho do botão
'background' : '#ffffff', //cordefundodobotão
'padding' : '6px', //distância da margem
'font-size' : '11px', //tamanho da fonte
'text-align' : 'center', //alinhamento do texto
'font-weight' : 'bold', //manter o texto em negrito
'text-transform': 'uppercase', // manter o texto em maiusculo
'color' : '#585858', // cor do texto
'margin-left' : '7px', //distância da margem esquerda
'margin-top' : '5px', //distância da margem superior
'cursor' : 'pointer' // cursor que é exibido ao passar o mouse
});
$('.postprofile > dl').css({
'padding' : '7px'
});
$('.showpostprofile').css({
'background-color' : '#fff',
'border-radius' : '6px',
'border' : 'solid 10px #bbb',
'position' : 'absolute',
'left' : '25%',
'padding' : '10px',
'font-size' : '11px',
'line-height' : '13px',
'text-align' : 'center',
'display': 'block'
});
});
Re: Botão exibir perfil
Agora está indo, mas tem mais um problema e.e
As configurações dela estão certas, mas quando atualizo a página a janela já fica ativa mesmo antes de eu clicar no botão. Anteriormente tinha acontecido isso porque eu havia tirado um "overflow: hidden;" do código, talvez tenha sido essa a causa do problema de novo.
As configurações dela estão certas, mas quando atualizo a página a janela já fica ativa mesmo antes de eu clicar no botão. Anteriormente tinha acontecido isso porque eu havia tirado um "overflow: hidden;" do código, talvez tenha sido essa a causa do problema de novo.
Re: Botão exibir perfil
Nah... o erro foi uma mudança arbitrária feita por mim ou por você, eu sinceramente não lembro, mas, testa aí:
- Código:
$(function(){
$('.post, .postrow1, .postrow2, .postrow3').each(function(){
var t = $(this);
// armazenando
console.log('Recurso "Exibir Perfil" desenvolvido por Mateus Anjos. 19/04/2018. http://ajuda.forumeiros.com/u59217');
var perfil = t.find('.postprofile > dl > dd:nth-child(5)').html();
var resto = t.find('.postprofile > dl > dd:nth-child(7)').html();
var todos = perfil + "<br>" + resto + "<br>";
// removendo e adicionando
t.find('.postprofile > dl > dd:nth-child(5), .postprofile > dl > dd:nth-child(7)').remove();
t.find('.postprofile > dl > dt').after('<div class="exibirperfil">Exibir perfil</div>');
t.find('.postprofile').after('<div class="showpostprofile">'+todos+'</div>');
t.find('.postprofile > dl > div.exibirperfil').click(function(){
t.find('.showpostprofile').fadeToggle();
});
});
// estilo
$('.exibirperfil').css({
'border' : '3px double darkgreen',
'max-width' : '138px', //tamanho do botão
'background' : '#ffffff', //cordefundodobotão
'padding' : '6px', //distância da margem
'font-size' : '11px', //tamanho da fonte
'text-align' : 'center', //alinhamento do texto
'font-weight' : 'bold', //manter o texto em negrito
'text-transform': 'uppercase', // manter o texto em maiusculo
'color' : '#585858', // cor do texto
'margin-left' : '7px', //distância da margem esquerda
'margin-top' : '5px', //distância da margem superior
'cursor' : 'pointer' // cursor que é exibido ao passar o mouse
});
$('.postprofile > dl').css({
'padding' : '7px'
});
$('.showpostprofile').css({
'background-color' : '#fff',
'border-radius' : '6px',
'border' : 'solid 10px #bbb',
'position' : 'absolute',
'left' : '25%',
'padding' : '10px',
'font-size' : '11px',
'line-height' : '13px',
'text-align' : 'center',
'display': 'none'
});
});
Re: Botão exibir perfil
Agora sim pouha e.ê
Tá funcionando certinho
Edit: Esqueci do rank e.e falta ele ainda
Tá funcionando certinho
Edit: Esqueci do rank e.e falta ele ainda
Re: Botão exibir perfil
Visto que a maioria do pedido está respondido com sucesso, este tópico será marcado como resolvido. Lembrando que com 3 ou mais dias sem respostas em tópicos que envolvam JavaScript são considerados abandonados.
Tópico resolvidoTópico marcado como resolvido pela equipe por abandono do autor. |
Tópicos semelhantes
» "Exibir Perfil" na navbar
» Exibir perfil
» Exibir perfil
» Botão "Exibir perfil" nas menagens
» Botão Exibir Perfil
» Exibir perfil
» Exibir perfil
» Botão "Exibir perfil" nas menagens
» Botão Exibir Perfil
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos