Это простой динамичный список онлайн пользователей, но предоставленный в блочной системе. Профиль и личные сообщения открываются в ajax окнах. Автообновление производится каждые 30 секунд. Скрипт выполнен без лишних функций и наворотов, так что код получился очень компактный
Установка:
В шаблонах своего сайта замените $ONLINE_USERS_LIST$ на:
Code
<div class="apoulist" style="display:none;">
$ONLINE_USERS_LIST$
</div>
<style>
.apo {
width:95%;
height:15px;
background:rgba(230, 230, 230, 0.8);
padding:2px;
vertical-align:middle;
margin-bottom:5px;
font-weight:bold;
border-left:1px solid #ccc;
border-top:1px solid #ccc;
border-radius:2px;
}
.apo a {
text-decoration:none;
}
</style>
<script>
// Удобная динамичная онлайн статистика by Apocalypse
function apoOnGet() {
// Основная функция получения и стилизации списка пользователей
$('.apoulist').load('# .apoulist', function() {
// Убираем запятые
$('.apoulist').html($('.apoulist').html().replace(/\,/g, ''));
// Делаем форму видимой
$('.apoulist').fadeIn();
// Превращаем список пользователей в блочный вариант + отключаем события при клике
$('.apoulist a').each(function() {
$(this).html('<table class="apo"><td>' + $(this).html() + '</td><td align="right"><img src="http://s36.ucoz.net/.s/img/icon/us.png" onclick="apoGetP(\'' + $(this).text() + '\')" class="apoprofile" height="11px" title="Мини-профиль"> <img onclick="apoGetPm(\'' + $(this).attr('href') + '\')" src="http://s36.ucoz.net/.s/img/icon/mf.png" height="11px" title="Отправить сообщение"></td></table>');
}).removeAttr('onclick').click(function() {return false});
});
};
// Запускаем функцию при загрузке страницы
apoOnGet();
// Запускаем интервал автообновления
setInterval(function() {
apoOnGet();
}, 30000);
// Функция получения профиля
function apoGetP(name) {
new _uWnd('apoGetP', 'Профиль ' + name, 600, 400, {autosize:0, closeonesc:1, popup:1, modal:1}, {url:'/index/8-0-' + name.replace(/\-/gi, '~'), xml:false});
}
// Функция получения страницы Личных Сообщений
function apoGetPm(url) {
var url2 = url.split('-');
var url3 = url2[url2.length];
new _uWnd('apoGetPm', 'Сообщение', 600, 400, {autosize:0, closeonesc:1, popup:1, modal:1}, {url:'/index/14-' + url3 + '-0-1', xml:false});
}
// ApoTeam (c) 2012
</script>
$ONLINE_USERS_LIST$
</div>
<style>
.apo {
width:95%;
height:15px;
background:rgba(230, 230, 230, 0.8);
padding:2px;
vertical-align:middle;
margin-bottom:5px;
font-weight:bold;
border-left:1px solid #ccc;
border-top:1px solid #ccc;
border-radius:2px;
}
.apo a {
text-decoration:none;
}
</style>
<script>
// Удобная динамичная онлайн статистика by Apocalypse
function apoOnGet() {
// Основная функция получения и стилизации списка пользователей
$('.apoulist').load('# .apoulist', function() {
// Убираем запятые
$('.apoulist').html($('.apoulist').html().replace(/\,/g, ''));
// Делаем форму видимой
$('.apoulist').fadeIn();
// Превращаем список пользователей в блочный вариант + отключаем события при клике
$('.apoulist a').each(function() {
$(this).html('<table class="apo"><td>' + $(this).html() + '</td><td align="right"><img src="http://s36.ucoz.net/.s/img/icon/us.png" onclick="apoGetP(\'' + $(this).text() + '\')" class="apoprofile" height="11px" title="Мини-профиль"> <img onclick="apoGetPm(\'' + $(this).attr('href') + '\')" src="http://s36.ucoz.net/.s/img/icon/mf.png" height="11px" title="Отправить сообщение"></td></table>');
}).removeAttr('onclick').click(function() {return false});
});
};
// Запускаем функцию при загрузке страницы
apoOnGet();
// Запускаем интервал автообновления
setInterval(function() {
apoOnGet();
}, 30000);
// Функция получения профиля
function apoGetP(name) {
new _uWnd('apoGetP', 'Профиль ' + name, 600, 400, {autosize:0, closeonesc:1, popup:1, modal:1}, {url:'/index/8-0-' + name.replace(/\-/gi, '~'), xml:false});
}
// Функция получения страницы Личных Сообщений
function apoGetPm(url) {
var url2 = url.split('-');
var url3 = url2[url2.length];
new _uWnd('apoGetPm', 'Сообщение', 600, 400, {autosize:0, closeonesc:1, popup:1, modal:1}, {url:'/index/14-' + url3 + '-0-1', xml:false});
}
// ApoTeam (c) 2012
</script>
Готово.
Другие новости |
Поделиться ссылкой
|