Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Widget top postadores
3 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
Widget top postadores
Detalhes da questão
Endereço do fórum: http://master-publicitario.forumeiros.com/
Versão do fórum: ModernBB
Descrição
Olá!
Eu usei este código:
- Código:
<div class="main-content clearfix">
<script>
jQuery(document).ready(function() {
var members_top_posters = sessionStorage.getItem('members_top_posters');
if(members_top_posters) {
jQuery('#members_top_posters').html(members_top_posters);
} else {
jQuery.get('/memberlist?mode=posts&order=DESC&submit=Ok&username', function(d) {
var members = jQuery('.table a[href^="/u"]:lt(5)', d);
jQuery('#members_top_posters').html(members);
jQuery('#members_top_posters').find('a[href^="/u"]').each(function() {
jQuery(this).wrap('<div class="m_b"></div>');
var post = jQuery(this).attr('href');
jQuery(this).after('<span class="posts"></span>');
jQuery(this).next().load(post+' .main #field_id-6 dd div', function() {
jQuery(this).text(jQuery(this).text());
sessionStorage.setItem('members_top_posters', jQuery('#members_top_posters').html());
});
});
});
}
});
</script>
<div id="members_top_posters">
</div><style>
#members_top_posters .m_b {
margin: 4px 0;
}
#members_top_posters .m_b:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#members_top_posters a span {text-decoration: none;}
#members_top_posters .m_b img {
-moz-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
background: #fff;
border: 1px solid #D5D5D5!important;
box-shadow: 0 2px 2px rgba(0,0,0,0.1);
float: left;
height: 30px;
margin: 0 3px;
padding: 1px;
width: 30px;
}
#members_top_posters .m_b img:hover {
-moz-box-shadow: 0 2px 2px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.5);
border-color: #666;
box-shadow: 0 2px 2px rgba(0,0,0,0.5);
}
#members_top_posters .posts {
display: block;
margin-top: 5px;
margin-left: 45px;
font: 11px helvetica, arial, sans-serif;
color: #777777;
}
#members_top_posters .posts:after {
content: ' mensagens';
}
</style>
</div>
Para tentar obter este widget:
Mas ele não está a funcionar.
Re: Widget top postadores
Adicione esse Javascript com investimento em Todas as páginas:
E adicione ao seu CSS:
o/
- Código:
(function($) {
'use strict';
if (!window.sessionStorage || !window.JSON) {
return;
}
var config = {
storage: 'fa.top-posters.overall',
selectors: {
avatar: '.mod-login-avatar img',
module: '.mod-top-row',
}
};
$(function() {
var $module = $(config.selectors.module);
if (!$module.length) {
return;
}
var render = function(data) {
$module.each(function(index, elem) {
var $elem = $(elem);
var href = $elem.find('a[href^="/u"]:first').attr('href');
var item = data[href];
if (!item) {
return;
}
$elem.prepend([
'<a href="' + href + '" class="fa-custom-mod-top-avatar">',
' <img src="' + item.avatar + '" />',
'</a>'
].join('\n'));
});
};
var stored = window.sessionStorage.getItem(config.storage);
if (stored) {
render(JSON.parse(stored));
return;
}
var data = {};
var promises = [];
$module.find('a[href^="/u"]').each(function(index, elem) {
var $elem = $(elem);
var href = $elem.attr('href');
var promise = $.get(href, function(context) {
data[href] = {
avatar: $(config.selectors.avatar, context).attr('src'),
};
});
promises.push(promise);
});
$.when.apply(null, promises).done(function() {
window.sessionStorage.setItem(config.storage, window.JSON.stringify(data));
render(data);
});
});
}(jQuery));
E adicione ao seu CSS:
- Código:
#main-content .mod-top-row {
padding-left: 72px;
margin-bottom: 10px;
position: relative;
}
#main-content .mod-top-row:nth-child(-n + 3) {
padding-left: 72px;
}
.fa-custom-mod-top-avatar {
display: block;
padding: 2px;
border: 1px #333 solid;
position: absolute;
left: 40px;
}
.fa-custom-mod-top-avatar img {
width: 32px;
height: 32px;
}
.mod-top-row:nth-child(-n + 3) .fa-custom-mod-top-avatar {
left: 20px;
}
.mod-top-row:nth-child(-n + 3) .fa-custom-mod-top-avatar img {
width: 38px;
height: 38px;
}
o/
Re: Widget top postadores
Sugiro que limpe seu cache e seus cookies, a mim também aparece o efeito.
Até mais.
Até mais.
Re: Widget top postadores
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para "Questões resolvidas". |
Tópicos semelhantes
» Personalizar widget top postadores
» Widget top postadores com avatar redondo
» Widget top postadores com avatar redondo
» Widget usuários postadores para ModernBB
» Widget top postadores com avatar redondo
» Widget top postadores com avatar redondo
» Widget top postadores com avatar redondo
» Widget usuários postadores para ModernBB
» Widget top postadores com avatar redondo
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