Пользователи онлайн с Аватарками

Версия INVISION

Код:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
 jQuery("#my_member_list").load("/memberlist .member-list", function(data) {
    jQuery(data).find('.popupmenu').each(function(index) {
      var href = jQuery(this).find('.popupmenu-item>a').first().attr("href");
      var user = jQuery(this).find('.popupmenu-item>a').last().attr("href").replace("/spa/","");           
      var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");                     
      var imagen = jQuery(this).find('.avatar>img');
      var miembro = jQuery("<div class='name'>" + user + "</div>");           
      jQuery(enlace).append(imagen).append(miembro);           
      jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));       
    });
 });
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
}
#avatars .grid_item {
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;
}
#avatars .name {
 font-size: 9px;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}
</style>

PunBB:

Код:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
 jQuery("#my_member_list").load("/memberlist .frm-form", function(data) {
    jQuery(data).find('.avatar-mini').each(function(index) {           
      var href = jQuery(this).find('a.gen').attr("href");       
      var user = jQuery(this).find("a.gen span span strong").text();
      var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");                     
      var imagen = jQuery(this).find('a.gen>img');
      var miembro = jQuery("<div class='name'>" + user + "</div>");           
      jQuery(enlace).append(imagen).append(miembro);           
      jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));       
    });
 });
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
}
#avatars .grid_item {
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;
}
#avatars .name {
 font-size: 9px;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}
</style>

phpBB3:

Код:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
 jQuery("#my_member_list").load("/memberlist .memberlist", function(data) {
    jQuery(data).find('.avatar-mini>a').each(function(index) {
        jQuery("#avatars").append(jQuery(this));                         
    });
 });
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;   
}
#avatars strong {
 font-size: xx-small;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}   
</style>

phpBB2:

Код:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
  jQuery("#my_member_list").load("/memberlist .memberlist", function(data) {                           
      jQuery(data).find('table.forumline tbody tr').each(function(index) {           
        var href = jQuery(this).find("div.avatar.mini>a").attr("href");       
        var user = jQuery(this).find("span.gen a.gen span strong").text();   
        var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");     
        var imagen = jQuery(this).find("div.avatar.mini>a>img"); 
        var miembro = jQuery("<div class='name'>" + user + "</div>");           
        jQuery(enlace).append(imagen).append(miembro);           
        jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));                       
      });       
  });     
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
}
#avatars .grid_item {
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;
}
#avatars .name {
 font-size: 9px;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}
</style>

Ставим в виджет...

не знаю можно здесь с вопросами или нет) это единственный скрипт с аватарами, который у меня заработал на Инвизион, спасибо!)) Хотелось бы уточнить, авки появились всех пол-лей которые заглядывали за сутки, а не сиюминутно онлайн, так и задумано или у меня не срабатывает?
Если у вас найдется еще что с аватарами для Инвизион, приносите)))

Ксандра пишет:не знаю можно здесь с вопросами или нет)  это единственный скрипт с аватарами, который у меня заработал на Инвизион,  спасибо!))  Хотелось бы уточнить, авки появились всех пол-лей которые заглядывали за сутки, а не сиюминутно онлайн, так и задумано или у меня не срабатывает?
Если у вас найдется еще что с аватарами для Инвизион, приносите)))

И тех кто онлайн и за 24 часа...Если будет что-то новое обезательно поделюсь!

Administrator NEXT-EXPRES, почему- то с включением виджета окно сообщений перестало норм работать, исчезла его менюшка  сверху, переходим в предпросмотр, там окно смайликов есть, но они не вставляются. Проверяла несколько раз, с отключением все снова работает. Жалко выключать игрушку)) может это исправимо? или связано с переделкой рамеров

вчера я под себя исправила

с неизмененным скриптом выглядело  так

4 аватара в ряду обрезалась,  они приплюснулись  в квардрат

потом я  увеличила авки, по 2, но отряд онлайнщиков вытянулся далеко вниз))


остановилась на этом


вообще, можно было менять эти размеры?

#avatars{
width: 215px;

height: 50px;
width: 50px;

padding: 0 3px 0 0;
width: 50px;

и шрифт имени с 9 на 7

Administrator NEXT-EXPRES,
спасибо за туториал, надеюсь вам удастся отладить его, в связи с комментариями пользовательницы Ксандра ...

Вы не могли бы дополнить его скриншотами - чтобы сразу можно было увидеть, что должно получиться в результате ?
  

Вот он на моем сайте..и все работает нормально у меня... вот пример...(http://next.expressforum.org/)...пока не могу дать конкретный ответ...вот мои размеры скрипта...

Код:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<div id="my_member_list" style="display:none;">
</div>
<div align="center" id="avatars">
</div><script>
jQuery(document).ready(function(){
 jQuery("#my_member_list").load("/memberlist .member-list", function(data) {
    jQuery(data).find('.popupmenu').each(function(index) {
      var href = jQuery(this).find('.popupmenu-item>a').first().attr("href");
      var user = jQuery(this).find('.popupmenu-item>a').last().attr("href").replace("/spa/","");           
      var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");                     
      var imagen = jQuery(this).find('.avatar>img');
      var miembro = jQuery("<div class='name'>" + user + "</div>");           
      jQuery(enlace).append(imagen).append(miembro);           
      jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));       
    });
 });
});
</script><style>
#avatars{
 width: 180px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 0px solid black;
 height: 40px;
 width: 40px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
}
#avatars .grid_item {
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 40px;
}
#avatars .name {
 font-size: 8px;
 color:orange;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}
</style>

Попробуйте так...может получится как у меня...

У меня версия Invision и этот скрипт работает нормально...

ваш Invision выглядит оч благородно и аватары смотрятся иначе, видимо потому что равносторонние, а у нас кто во что горазд, поэтому сплющиваются. Интересно, в аватаре после последнего сообщения тоже размеры сторон нерашаемы.. Ну да ладно, это терпимо, когда мелкие, попробовала последний скрипт, с менюшкой проблема осталась, к сожалению. Я в админстве меньше м-ца, может что конфликтует или не хватает наоборот, вроде мало что приделано, не разберусь..

Я бы с удовольствием помог...но это всё что мог я поделится с вами...Может найдутся другие мастера и помогут вам,миледи...Возможно и есть какой-то комфликт с каким-то скриптом...

Ксандра пишет:ваш Invision выглядит оч благородно и аватары смотрятся иначе, видимо потому что равносторонние, а у нас кто во что горазд, поэтому сплющиваются. Интересно, в аватаре  после последнего сообщения тоже размеры сторон нерашаемы.. Ну да ладно, это терпимо, когда мелкие, попробовала последний скрипт,  с менюшкой проблема осталась, к сожалению. Я в админстве меньше м-ца, может что конфликтует или не хватает наоборот, вроде мало что приделано, не разберусь..

измините размер виджета...190px а у скрипта 180px...может и получится...


И размер аватаров на форуме ставте по меньше...пробуйте самый малый размер...

нашла причину почему виджет не работает у меня,  на тестовом форуме поставила слева - менюшка быстрого и развернутого ответов на месте, но стоит передвинуть вправо (у меня правые виджеты),  как меню пропадает. Поменяла 2 значения "слева" на "справа" от балды, какие нашла)))

#avatars a{
background: none !important;
padding-right: 0 !important;

#avatars .grid_item {
float: right;


Не помогло. В общем, если кто-то соображающий сможет его настроить для правосторонних виджетов, будет здорово) а нет, так будем знать))

Вот ище вариант...ставим в виджет...


Versión phpBB2:

Код:


<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
  jQuery("#my_member_list").load("/memberlist .memberlist", function(data) {                         
      jQuery(data).find('table.forumline tbody tr').each(function(index) {         
        var href = jQuery(this).find("div.avatar.mini>a").attr("href");       
        var user = jQuery(this).find("span.gen a.gen span strong").text();   
        var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");     
        var imagen = jQuery(this).find("div.avatar.mini>a>img"); 
        var miembro = jQuery("<div class='name'>" + user + "</div>");           
        jQuery(enlace).append(imagen).append(miembro);           
        jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));                       
      });       
  });     
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
}
#avatars .grid_item {
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;
}
#avatars .name {
 font-size: 9px;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}
</style>

Versión phpBB3:

Код:


<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
 jQuery("#my_member_list").load("/memberlist .memberlist", function(data) {
    jQuery(data).find('.avatar-mini>a').each(function(index) {
        jQuery("#avatars").append(jQuery(this));                       
    });
 });
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;   
}
#avatars strong {
 font-size: xx-small;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}   
</style>

Versión punBB:

Код:


<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
 jQuery("#my_member_list").load("/memberlist .frm-form", function(data) {
    jQuery(data).find('.avatar-mini').each(function(index) {         
      var href = jQuery(this).find('a.gen').attr("href");       
      var user = jQuery(this).find("a.gen span span strong").text();
      var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");                     
      var imagen = jQuery(this).find('a.gen>img');
      var miembro = jQuery("<div class='name'>" + user + "</div>");           
      jQuery(enlace).append(imagen).append(miembro);           
      jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));       
    });
 });
});
</script>
<style>
#avatars{
 width: 215px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
#avatars img{
 border: 1px solid black;
 height: 50px;
 width: 50px;
}
#avatars a{
 background: none !important;
 padding-left: 0 !important;
}
#avatars .grid_item {
 float: left;
 overflow: hidden;
 padding: 0 3px 0 0;
 width: 50px;
}
#avatars .name {
 font-size: 9px;
 color: grey;
 overflow: hidden;
 text-align: center;
 white-space: nowrap;
}
</style>

Versión Invision:


<div id="my_member_list" style="display:none;"></div>
<div align="center" id="avatars"></div>
<script>
jQuery(document).ready(function(){
jQuery("#my_member_list").load("/memberlist .member-list", function(data) {
jQuery(data).find('.popupmenu').each(function(index) {
var href = jQuery(this).find('.popupmenu-item>a').first().attr("href");
var user = jQuery(this).find('.popupmenu-item>a').last().attr("href").replace("/spa/","");
var enlace = jQuery("<a href='" + href + "' alt='" + user + "' title='" + user + "' />");
var imagen = jQuery(this).find('.avatar>img');
var miembro = jQuery("<div class='name'>" + user + "</div>");
jQuery(enlace).append(imagen).append(miembro);
jQuery("#avatars").append(jQuery("<span class='grid_item'>").append(enlace));
});
});
});
</script>
<style>
#avatars{
width: 215px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
#avatars img{
border: 1px solid black;
height: 50px;
width: 50px;
}
#avatars a{
background: none !important;
padding-left: 0 !important;
}
#avatars .grid_item {
float: left;
overflow: hidden;
padding: 0 3px 0 0;
width: 50px;
}
#avatars .name {
font-size: 9px;
color: grey;
overflow: hidden;
text-align: center;
white-space: nowrap;
}
</style>

 последняя версия кода работает и на правом виджете, здорово))

Пожалуйста!Это прекрасно когда все работает!В скором времени найду решение как в чате ставить аватары...сейчас тестирую...

у меня опять вопросик, как сделать, чтобы эти авки были видны гостям? Профиль открыла для гостей, не помогло

Открыть нужно все для гостям....тоес-ть и виджеты и темы...

спс) не хотелось бы лишится админ-закутка)))

просто сейчас не могу смотреть что именно нужно..просто на сервере опять работы наверное...но обезательно скажу точно что нужно