Логин:
Пароль:
Страница 1 из 11
Форум » О uCoz » Скрипты » Вид статистики
Вид статистики
AndreyДата: Среда, 09.09.2015, 18:38:05 | Сообщение # 1
Технарь
Offline
3

Предоставляю вам свою версию статистики. Блок, напоминающий строку состояния, фиксируется в правом нижнем углу. При нажатии на кнопку, блок плавно и красиво разворачивается и выводит более подробную статистику сайта.

С начала прописываем CSS:
Код
.statNew{     
     font-family:times new roman;font-size:16px;     
     background-color: rgba(0,08,0,0.7);     
     color:#fff;     
     border: 1px solid black;     
-webkit-box-shadow: inset 0 1px 0 0 white;     
-moz-box-shadow: inset 0 1px 0 0 white;     
     box-shadow: inset 0 1px 0 0 white;     
     padding: 0 5px;     
     border-radius: 5px 0 0;     
     width:250px;     
     position:fixed;     
     bottom:0;     
     right:0;     
}     
.statNew hr{border:0;border-bottom:1px dotted #fff;}     
.statNew a:link{color:#C4C4C4;text-decoration:none;}     
.statNew a:visited{color:#C4C4C4;}     
.statNew a:hover{color:#fff;}     
.statNew a:active{color:#C4C4C4;}     
#expandSt, #expandSt2{cursor:pointer;}


Теперь на странице где хотите видеть статистику после </head> прописываем первый скрипт:
Код
<script type="text/javascript">  
     $(document).ready(function(){     
     var statNew1 = $('.statNew1'), statNew2 = $('.statNew2');     
     $('#schetPol').html($('.tOnline b').html());     
     $('#expandSt').click(function(){     
     statNew1.slideUp(1000);     
     statNew2.delay(1000).slideDown(2000);     
     });     
     $('#expandSt2').click(function(){     
     statNew2.slideUp(2000);     
     statNew1.delay(2000).slideDown(1000);     
     });     
});     
</script>


Далее на этой же странице только уже после </body>, прописываем:
Код
<div class="statNew statNew1">Сейчас на сайте: <span id="schetPol">0</span> <img src="/img/Stat_Icon.png" border="0" alt="" style="float:right" id="expandSt"></div>    
<div style="display:none" class="statNew statNew2"><img src="/img/Stat_Icon2.png" border="0" alt="" style="float:right; top:0;" id="expandSt2">$ONLINE_COUNTER$<hr>Пользователи онлайн:<br>$ONLINE_USERS_LIST$</div>


Вот и всё, осталось только из прикреплённого ниже архива залить к себе на хост две иконки в папку "img"

Материал подготовил: Andrey
Для того чтоб скачать прикреплённые файлы нужно Зарегестрироватся, или войти на сайт под своим логином
 
профиль
Форум » О uCoz » Скрипты » Вид статистики
Страница 1 из 11
Поиск: